SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 CSS float margin/padding issue?? PLEASE HELP!!!

    hello everyone, I am designing a new page for my work, and I have run into a problem with IE6 not rendering the CSS correctly on my page. It renders fine with FireFox and IE7 but not IE6. when you look at the page in IE6, the floating div's have these breaks/margins in the backgound. Take a look and tell me what you think.

    http://www.fammed.ouhsc.edu/asp_webpage/

    here is the CSS code for my page, I cant figure out why its doing that!!!! please help!!

    thanks

    -eric

    -----------------------------------------------------------------------------------------------

    *{ margin:0px; padding:0px;}

    body
    {
    background-color: #656565;
    background-image: url(Images/background.gif);
    background-repeat: repeat;
    margin:0px;
    padding:0px;
    text-align: justify;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 0.7em;
    color: #000000;






    }
    .Link
    {
    text-decoration:none
    }
    .Link:hover
    {
    text-decoration: Underline;
    }



    /* 1 HEADER */

    .header_name {
    background-image: url(Images/header_name.jpg);
    background-repeat: no-repeat;
    float:left ;
    width: 400px;
    height: 78px;
    margin:0px;
    padding:0px;
    display:inline;


    }


    .header_end
    {

    background-image: url(Images/header_end.jpg);
    background-repeat: no-repeat ;
    float:right;
    width: 32px;
    height: 78px;
    top:0px;
    margin:0px;
    padding:0px;
    display: inline;


    }


    .header_middle
    {

    padding:0px;
    background-image: url(Images/header_middle.jpg);
    background-repeat:repeat-x;
    Margin-left: 400px;
    Margin-right: 32px;
    height: 78px;


    }
    .header_menu
    {
    background-color:#990000;
    height: 27px;

    }
    h1 {
    position: absolute;
    right: 15px;
    top: 10px;
    text-transform: uppercase;
    font-size: 18px;
    font-style:italic;
    font-weight:bolder;


    }

    h2 {
    position: absolute;
    right: 30px;
    top: 48px;
    font-size: 11px;
    font-style:italic;



    }


    .Content
    {
    position:inherit ;
    padding:10px;
    min-height:500px



    }






    /* 3 FOOTER */

    .footerbg
    {
    position: absolute;

    height: 25px;


    }

    .footer_left {
    background-image: url(images/footer.jpg);
    background-repeat: repeat-x ;
    float:left;
    width:500px;
    text-align:left;
    height: 35px;
    font-size: 10px;
    color: #ffffff;
    padding-top:0px;
    margin:0px;
    display:inline;
    }
    .footer_right {
    background-image: url(images/footer.jpg);
    background-repeat: repeat-x ;

    margin-left: 499px;

    text-align:right;
    height: 35px;
    font-size: 10px;
    color: #ffffff;
    padding-top:5px;
    }

    .footer_link
    {
    position:relative;
    right:10px;
    text-decoration:none;

    }

    .footer_link:hover
    {
    text-decoration: underline;
    }

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,526
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Its the 3px jog when you have floated elements neext to static content (see faq on floats).

    Add this at the end of your css.

    Code:
    * html .header_name {margin-right:-3px;}
    * html .header_end {margin-left:-3px;}
    * html .header_middle {margin:0 29px 0 397px}
    Read the faq on floats for the explanation .

  3. #3
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    THANK YOU VERY MUCH!!!! I could have swarn that I had tried that before, but I guess I didnt since it worked perfectly!!

    thanks again!!!


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
  •