Datafeedr Support Forums  

Go Back   Datafeedr Support Forums > Current Version (V3) Forum > Questions
Home Register FAQ Members List Calendar Search Today's Posts Mark Forums Read

Important - The support forums are now in "read-only" mode as we transition to an alternative help desk solution. Feel free to contact us here with any of your questions or search the forums for an existing solution.
 
 
Thread Tools Search this Thread Display Modes
  #1  
Old February 27th, 2014, 10:48 AM
spaceace spaceace is offline
 
Join Date: Feb 2014
Posts: 8
Default Product Detail image and text problem

URL to page in question: http://preworkoutsupps.com/store/all...-pre-jym-7106/


Hi,

Im just getting the hang of changing CSS for these categories, but my problem is with the description going behind the image and blocking some of the text. The text is fine for the first 1/2-3/4 of the description, but after that the text seems to float under the main image. As you can see with this page, I was trying to add an <ul> but the html doesn't seem to work correctly and some of the text is hidden under the image.

Here is the code I am using for this specific product under the "more info" tab:

<h3><span style="color:#088A08">Pre-Workout Powder Powerhouse*</span></h3>
<p><i>Scientifically Advanced All-In-One Formula for Improved Workouts.*</i></p>
<p>"Put simply, Pre JYM is the most effective pre-workout supplement I've ever developed. It's built on solid science, years of study, and decades of professional experience. Nothing is hidden, and there is no filler. Pre JYM is research made real. It's pure pre-workout fuel." - Jim Stoppani, PhD</p>
<ul>
<li>300mg caffeine per serving*</li>
<li>20 Servings</li>
<li>Flavors: Cherry Limeade, Raspberry Lemonade</li>
</ul>

How can I get all of the text to float left of the image?
  #2  
Old February 27th, 2014, 10:59 AM
Eric's Avatar
Eric Eric is offline
Datafeedr Team
 
Join Date: Feb 2008
Posts: 16,902
Default

Hi,

I don't see any problems. It looks good to me in Chrome and Firefox:



Eric
  #3  
Old February 27th, 2014, 11:33 AM
spaceace spaceace is offline
 
Join Date: Feb 2014
Posts: 8
Default

Look at the list items.
300mg is cut off.
20 is cut off and Servings has been placed on the 300mg caffeine per serving line.

<ul>
<li>300mg caffeine per serving*</li>
<li>20 Servings</li>
<li>Flavors: Cherry Limeade, Raspberry Lemonade</li>
</ul>
  #4  
Old February 27th, 2014, 12:00 PM
Eric's Avatar
Eric Eric is offline
Datafeedr Team
 
Join Date: Feb 2008
Posts: 16,902
Default

Hi,

It's not about the styling or CSS. When viewing your page with no CSS, 300 is missing and your list is malformed.



Here's the source code of your HTML list:

HTML Code:
<ul>
	mg caffeine per serving*</li>
 	Servings</li>
	<li>Flavors: Cherry Limeade, Raspberry Lemonade</li>
</ul>
It's badly formed.

It should be like this:

HTML Code:
<ul>
	<li>300mg caffeine per serving</li>
	<li>20 Servings</li>
	<li>Flavors: Cherry Limeade, Raspberry Lemonade</li>
</ul>
Eric
  #5  
Old February 27th, 2014, 12:22 PM
spaceace spaceace is offline
 
Join Date: Feb 2014
Posts: 8
Default

That's how I have it. See my first post.

It is displaying malformed, however I am pasting in exactly how you suggest:

<ul>
<li>300mg caffeine per serving*</li>
<li>20 Servings</li>
<li>Flavors: Cherry Limeade, Raspberry Lemonade</li>
</ul>

That's the problem, it is not displaying correctly and messing up the code.

Here is another example:
http://preworkoutsupps.com/store/all...7000346643063/

This is how I have the code:
<h3>PWR™—Ultra-Concentrated Pre-Workout Revolution</h3>
<i> Powered By Red Dralion!</i>
<ul>
<li>Now Even More Powerful with “Energy Support” Red Dralion™</li>
<li> Power. Energy. Focus. Pump. INSTANTLY!</li>
<li>3x more potent and 10x more concentrated than leading brands!</li>
<li> Powered by the exclusive “energy support,” Red Dralion™</li>
<li> Delicious fruit flavors (no artificial colors or dyes)</li>
<li>Strong Stimulants</li>
<li>5 and 30 Serving Sizes</li>
<li>Flavors: Blue Raspberry, Fruit Punch</li>
</ul>

Two bullet points are cut off and not displaying properly:
<li>3x more potent and 10x more concentrated than leading brands!</li> - 3 is cut off
<li>5 and 30 Serving Sizes</li> - 5 is cut off
  #6  
Old February 27th, 2014, 12:37 PM
Eric's Avatar
Eric Eric is offline
Datafeedr Team
 
Join Date: Feb 2008
Posts: 16,902
Default

Hi,

Strange... I see the problem now though not sure why it's a problem.

If you have a space after your <li> tag and before your </li> tag, then all works fine.

Therefore this works (notice the space):

HTML Code:
<h3>
	<span style="color:red">PWR™—Ultra-Concentrated Pre-Workout Revolution</span>
</h3>
<i> Powered By Red Dralion!</i> 
<ul>
	<li> Now Even More Powerful with "Energy Support" Red Dralion™ </li>
	<li> Power. Energy. Focus. Pump. INSTANTLY! </li>
	<li> 3x more potent and 10x more concentrated than leading brands! </li>
	<li> Powered by the exclusive “energy support,” Red Dralion™ </li>
	<li> Delicious fruit flavors (no artificial colors or dyes) </li>
	<li> Strong Stimulants </li>
	<li> 5 and 30 Serving Sizes </li>
	<li> Flavors: Blue Raspberry, Fruit Punch </li>
</ul>
However without the space, the list will break. This code breaks:

HTML Code:
<h3>
	<span style="color:red">PWR™—Ultra-Concentrated Pre-Workout Revolution</span>
</h3>
<i> Powered By Red Dralion!</i> 
<ul>
	<li>Now Even More Powerful with "Energy Support" Red Dralion™</li>
	<li>Power. Energy. Focus. Pump. INSTANTLY!</li>
	<li>3x more potent and 10x more concentrated than leading brands!</li>
	<li>Powered by the exclusive “energy support,” Red Dralion™</li>
	<li>Delicious fruit flavors (no artificial colors or dyes)</li>
	<li>Strong Stimulants</li>
	<li>5 and 30 Serving Sizes</li>
	<li>Flavors: Blue Raspberry, Fruit Punch</li>
</ul>
We will investigate the issue and fix it. In the meantime, can you add a space after your <li> tags and before your </li> tags?

Eric
  #7  
Old February 27th, 2014, 12:43 PM
spaceace spaceace is offline
 
Join Date: Feb 2014
Posts: 8
Default

Awesome find.

I will make the adjustment. I never noticed the spacing. Thanks for quickly solving this.
  #8  
Old February 28th, 2014, 09:42 AM
Eric's Avatar
Eric Eric is offline
Datafeedr Team
 
Join Date: Feb 2008
Posts: 16,902
Default

Hi,

This bug has been fixed in the newest version of the plugin.

Eric
 


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Product detail page product image sizw urbanlymedia Questions 1 November 12th, 2012 06:49 PM
Image sizes on Product Detail pages meperez Questions 1 August 26th, 2011 07:16 PM
Wrap Text and Larger Image on Product Detail page patagonia Questions 5 July 19th, 2011 09:52 PM
How to Wrap Text in Product Detail view patagonia Questions 2 January 31st, 2011 09:06 PM


All times are GMT -5. The time now is 04:16 PM.


Powered by vBulletin® Version 3.6.8
Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.