SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot LiamW's Avatar
    Join Date
    Mar 2003
    Location
    Hamilton, Ontario
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Post 2 Floats Not Aligning Correctly In IE Only

    The page in question is located over here.

    The top image you see there is one big background image except for the submit buttons. I'm trying to float 2 containers to position a transparent input box where the image is in the header. It works fine in both Firefox and Opera.

    I read to float the 2 containers left and set margins which I have done.

    If somebody could explain the issue with IE that would be great.
    Liam Whittle
    Hamilton Web Design

  2. #2
    SitePoint Evangelist gollux's Avatar
    Join Date
    Feb 2005
    Location
    Oregon, USA
    Posts
    414
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE Float Doubles Margin Error...

    Internet Explorer's bad math doubles the margins on floats, repair by giving the floats a display: inline; which forces IE to redo the math and then adjust the width by a pixel on the .input class and it all falls into place. Modifications to your css as follows:

    Code:
    #newsletter, #sendToFriend{
    	float: left;
    	display: inline;
    	margin-top: 68px;
    	position: relative;
    	width: 210px;
    }
    
    #newsletter{
    	margin-left: 279px;
    }
    
    #sendToFriend{
    	margin-left: 18px;
    }
    
    .input{
    	background: transparent;
    	border: 0 solid;
    	font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
    	height: 16px;
    	margin-bottom: 2px;
    	width: 163px;
    }
    Released under the Fiasco Labs Digital Damnation Copywright,
    it's yours to make whatever the 7734 you want with it.

    (c) 2005 Fiasco Labs All Wrongs Reserved

  3. #3
    SitePoint Zealot LiamW's Avatar
    Join Date
    Mar 2003
    Location
    Hamilton, Ontario
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Excellent.

    Thank you very much for your clear explanation.
    Liam Whittle
    Hamilton Web Design


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •