3 Replies - 2824 Views - Last Post: 26 July 2010 - 12:29 PM

#1 drewpark88  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 19
  • Joined: 08-February 10

IE7 Float Left Issues...

Posted 25 July 2010 - 05:35 PM

Hey Guys,

I am having issues with my website in ie7 and I am not sure why. I have attached two screenshots, one in ie7 ( hwich is messed up) and one in ie8 (which is working). My images aren't floating properly next to my text in ie7....I have even created two classes "alignleft" and "alignright" which utilize the float attribute and margins. Check out my screenshots that are attached.

Oh and here is sample css code I am using:

alignleft, img.alignleft {float:left; margin:0 10px 5px 0}


Any help will be greatly appreciated. Thank you.

- Drew

Attached image(s)

  • Attached Image
  • Attached Image


Is This A Good Question/Topic? 0
  • +

Replies To: IE7 Float Left Issues...

#2 jaydscape  Icon User is offline

  • New D.I.C Head

Reputation: -10
  • View blog
  • Posts: 21
  • Joined: 25-June 10

Re: IE7 Float Left Issues...

Posted 25 July 2010 - 05:36 PM

I'm not sure but that comma might have to be a ; .....Just guessing.
Was This Post Helpful? -1
  • +
  • -

#3 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: IE7 Float Left Issues...

Posted 25 July 2010 - 11:21 PM

nope, comma is correct.
Was This Post Helpful? 0
  • +
  • -

#4 Lemur  Icon User is offline

  • Pragmatism over Dogma
  • member icon


Reputation: 1381
  • View blog
  • Posts: 3,511
  • Joined: 28-November 09

Re: IE7 Float Left Issues...

Posted 26 July 2010 - 12:29 PM

Sometimes with IE you have to float the paragraph or text left as well (or right, either way) but it's a little quirk you're going to know and love fairly soon.

The other (and more likely possibility) is that it's overflowing the boundaries of the box you have set up for the content. It's a common mistake to forget that total width and height include the margins and paddings that you might put in.

An example: 500 px total width

You have an image that's 250 and text that's 250, no padding, theoretically this should work (though sometimes leaving 1-2 px off is a life saver)

You decide to add a 5px all around margin to all elements within, that would be 20px you need to account for, 10 on the image and 10 on the text, meaning that each could only be a max of 240px.

Try that out.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1