Forums

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

Home Forums CSS I’ve got a floating issue.

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

    Website: http://www.studentseatfree.com/brian

    I’m having an issue with getting some stuff floated correctly. The blue box with the red border should be right under the navbar and to the left of the rectangle ad. I’ve tried several different methods for clearing my float but I can never get it to go up past the rectangle ad. It’s so simple, I just can’t figure it out!

    HTML:

    Code:



    Students Eat Free – Exclusive Discounts


    Sort by:



    leaderboard

    rectangle

    skyscraper

    Jimbo’s Pizza Shop
    Free Chick-fil-A Chicken Sandwich with purchase of med Waffle Fries and med Coke.


    CSS:

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

    body {height: 100%; font-family:Helvetica Arial, Verdana, Courier;}

    #wrapper {min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -25px; /* the bottom margin is the negative value of the footer’s height */ }

    #side-background {background-image:url(images/side-background.png); background-position:bottom left; background-repeat:no-repeat; min-height:1001px; height:1001px; padding-top:10px;}
    #content {margin:0 auto; width:1000px;}
    #topbar {background-image: url(images/top_green.jpg); background-repeat:repeat-x; min-height:74px; height:74px;}

    #logo {float:left; display:inline;}
    #leaderboard {margin-top:25px;}

    #sort-area {width:300px; margin-left: 10px; float:left; display:inline; margin-top:15px;}
    #search-area {float:right; width:220px; display:inline; margin-top:15px;}

    /*Navigation Bar*/

    ul#nav {list-style-type: none; overflow: hidden; width:742px; margin:0 auto; cursor:pointer;}

    #exclusive_button {background-image:url(images/navbar.jpg); width:223px; height:37px; min-height:37px; }
    #exclusive_button:hover {background-image:url(images/navbar.jpg); width:223px; height:37px; min-height:37px; background-position:0px 37px;}

    #regular_button {background-image:url(images/navbar.jpg); width:232px; height:37px; min-height:37px; background-position: -223px 0px; margin-left: 223px; margin-top: -37px;}
    #regular_button:hover {background-image:url(images/navbar.jpg); width:232px; height:37px; min-height:37px; background-position: -223px 37px; margin-left: 223px; margin-top: -37px;}

    #advertise_button {background-image:url(images/navbar.jpg); width:158px; height:37px; min-height:37px; background-position: -455px 0px; margin-left: 455px; margin-top: -37px;}
    #advertise_button:hover {background-image:url(images/navbar.jpg); width:158px; height:37px; min-height:37px; background-position: -455px 37px; margin-left: 455px; margin-top: -37px;}

    #contact_button {background-image:url(images/navbar.jpg); width:129px; height:37px; min-height:37px; background-position: -613px 0px; margin-left: 613px; margin-top: -37px;}
    #contact_button:hover {background-image:url(images/navbar.jpg); width:129px; height:37px; min-height:37px; background-position: -613px 37px; margin-left: 613px; margin-top: -37px;}

    ul#nav li a {position: absolute; text-indent: -9000px;}

    /*END Navigation Bar*/

    #rectanglead {float:right; margin-top:10px; width:300px;}
    #skyscraperad {float:right; margin:10px 70px 0 0; width:160px;}

    /*Listings*/

    #listings {background-color: red; width:680px; margin:10px 0 0; padding:5px;}
    .coupon {background-color: blue; width:680px;}
    .couponlogo {float:left; display:inline; width:100px; height:100px; min-height:100px; vertical-align: middle;}
    .restname {}
    .description {}

    /*END Listings*/

    /*Footer*/

    #footer {height: 25px; background-color:#daf2c8;}

    #copy-list {text-align: center; font-size: 12px; color: #781a0c; margin-top:10px;}
    #copy-list ul, #copy-list li {display: inline; margin: 0; padding: 10px 10px 0 5px;}
    #copy-list a {color: #781a0c; margin-top:10px;}

    /*END Footer*/

    img {border:0}

    Thanks!

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.