We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.


Posted By

Uzbekjon on 07/07/08


Tagged

css hack ie


Versions (?)


Who likes this?

4 people have marked this snippet as a favorite

heinz1959
SpinZ
basicmagic
dazza


Bug Fix: IE Double Margin Float Bug


Published in: CSS 


It’s an Internet Explorer-exclusive bug wherein an element that is floated – and given a margin in the same direction as the float – ends up with twice the specified margin size. The fix is extremely simple. All you have to do is apply a display: inline rule to your floated element.

  1. /*
  2.   Instead of this
  3. */
  4. #content {
  5. float: left;
  6. width: 500px;
  7. padding: 10px 15px;
  8. margin-left: 20px;
  9. }
  10.  
  11. /*
  12.   Do this
  13. */
  14. #content {
  15. float: left;
  16. width: 500px;
  17. padding: 10px 15px;
  18. margin-left: 20px;
  19. display:inline;
  20. }

Report this snippet 

You need to login to post a comment.