X-Cart forums

[GreatLakesVacuum]

Hello all, We were trying to make it so that our details always showed under the image box due to compatibility with smaller monitors and I found a simple fix, by commenting out the float but it doesn't work for IE.

What is the better way to accomplish this?

Here is the page to view in FF and IE to understand the difference:

http://www.greatlakesvacuum.com/xcart/product.php?productid=93&cat=1&page=1

And here is the code from main.css including my commented out float entry:

.product-details .image {
  text-align: center;
  vertical-align: top;
  padding: 0px;
/*
  float: left;
*/
  margin: 10px; 
}

[balinor]

Float works fine, but you need to be sure to specify the width and clear it <div style="clear: both;"></div> or else it will get botched up.

[GreatLakesVacuum]

For some reason without me changing anything at all it seems to work fine now, yes... weird.

What specifically do I need to specify the width of? And if it looks ok now how could it later be botched up? I'm confused as to what would change...

[balinor]

Well if you float two things next to each other, often you need to specify the width so one doesn't stretch to 100% and kick the other one to the next line.