Jump to content

Floating issues


KevinM1

Recommended Posts

I'm trying to float two images to the left and right of a div, respectively, with a third item in the middle.  Since the images are small, they looked out of place when I enlarged them and floated all three to the left.  So, now I'm trying to float one left, one right, and leave the middle one alone (the div has text-align: center, so the middle image should be centered).  Unfortunately, my right-floated image keeps jumping down a line, so it looks pretty bad.  I tried restricting the containing div's height to 90px, but this hasn't helped the problem.

The problem can be seen at http://www.thinkingmachinestore.com/storefront.php.  I've put a black border around the div in question.  Interestingly, in IE7, it looks like the incorrectly floated image stretches the div vertically.  In Firefox, the div is the correct height, with the incorrectly floated image overlapping the lower-right border.

Please help.
Thanks :)
Link to comment
Share on other sites

The right floated image should come first in the code.
[code]
<a href="viewcat.php?cat=peripherals&PHPSESSID=99b9b7f7e7fa611cb34a2d4e6bf20799"><img src="images/store/printer.jpg" alt="" style="float: right;" /><img src="images/store/mp3.jpg" alt="" style="float: left;" /><img src="images/store/camera.jpg" alt="" /></a>
  <a href="viewcat.php?cat=peripherals&PHPSESSID=99b9b7f7e7fa611cb34a2d4e6bf20799"><img src="images/store/mp3.jpg" alt="" style="float: left;" /><img src="images/store/camera.jpg" alt="" /></a>
[/code]
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.