Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS CSS & Float Problem

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #23048
    chenry
    Member

    I’m having a display issue between Firefox and IE when working with floats. I’ve looked into the bugs with IE but I cannot figure it out why this will not work, any help would be greatly welcomed! Below is some of the code. If you would like to view the site please head to http://survey.gr-webdesigns.com/

    HTML Below:

    Code:
    Welcome!

    CSS Below:

    Code:
    body {
    background-color: #1D1E22;
    margin-top: 0px;
    margin-bottom: 0px;
    background-image: url(/images/header-bg.jpg);
    background-repeat: repeat-x;
    background-position: left top;
    }
    #site-outline {
    width: 900px;
    margin-right: auto;
    margin-left: auto;
    }
    #date-outline {
    float: right;
    width: 150px;
    margin-top: 35px;
    font-size: 16px;
    color: #CCCCCC;
    margin-right: 100px;
    }
    #top-middle-outline {
    float: left;
    height: 252px;
    background-image: url(/images/top-middle.jpg);
    background-repeat: no-repeat;
    margin-top: 50px;
    font-size: 36px;
    color: #FFFFFF;
    padding-top: 20px;
    padding-left: 200px;
    width: 348px;
    display: inline;
    margin-left: 30px;
    }
    #news-outline {
    float: right;
    margin-right: 20px;
    margin-top: 5px;
    }
    #news-top-outline {
    background-image: url(/images/news-top.jpg);
    background-repeat: no-repeat;
    height: 15px;
    width: 275px;
    }
    #news-middle-outline {
    background-image: url(/images/news-middle.jpg);
    background-repeat: repeat-y;
    width: 267px;
    padding-right: 4px;
    padding-left: 4px;
    }
    #news-bottom-outline {
    background-image: url(/images/news-bottom.jpg);
    background-repeat: no-repeat;
    height: 15px;
    width: 275px;
    }
    #content-main-outline {
    width: 900px;
    margin-top: 75px;
    display: inline;
    }
    #content-top-outline {
    background-image: url(/images/main-top-bg.jpg);
    background-repeat: no-repeat;
    height: 20px;
    margin-top: 80px;
    width: 900px;
    }
    #content-middle-outline {
    background-image: url(/images/main-middle-bg.jpg);
    background-repeat: repeat-y;
    padding-right: 7px;
    padding-left: 7px;
    }
    #content-outline {
    width: 575px;
    margin-top: 15px;
    float: left;
    }
    #content-bottom-outline {
    background-image: url(/images/main-bottom-bg.jpg);
    background-repeat: no-repeat;
    height: 30px;
    width: 900px;
    }
    .clear {
    clear: both;
    margin: 0px;
    padding: 0px;
    display: inline-block;
    }
    p {
    margin: 0px;
    padding: 0px;
    }
Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.