SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2007
    Location
    Cambs/Norfolk, UK
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    container div not containing

    OK, Could somebody please have a look at this and tell me what I have done wrong!

    http://www.littlemisstshirts.com/

    html:
    Code:
    <div id="container"> 
    <div id="header">Image</div>
    
    <div id="main">text</div>
    
    <div id="menu">
    <div class="menubox">
      <ul class="menu">
      <li><a href="index.html">Home</a></li>
      </ul>
    </div>
    </div>
    
    </div>
    CSS:
    Code:
    BODY
    { 
     background-image:url(../images/bg.jpg);
     background-attachment:fixed; 
     color: #000000;
     font-family: tahoma, verdana, arial;
     font-size: 1em;
     padding:20px;
    } 
    
    
    #header {
    height: 198px;
    background-image:url(../images/bgheader.jpg);
    background-position:bottom;
    background-repeat:repeat-x;
    padding:7px;
    }
    
    
    #container{
     margin: auto;
     color:#000000;
     background-color:#FFFFFF;
     border:6px solid #A00F1E;
    }
    
    #main {
    padding: 5px;
    float:right;
    text-align:left;
    width: 78&#37;;
    }
    
    
    #menu {
     width: 175px;
     padding-top:8px;
    text-align:left;
    }

  2. #2
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, try clearing the floats in the container div with an empty div.

    Code:
    <div id="container"> 
        <div id="header">Image</div>
        
        <div id="main">text</div>
        <div id="menu">
            <div class="menubox">
            <ul class="menu">
              <li><a href="index.html">Home</a></li>
            </ul>
            </div>
        </div>
        <div class="clearboth">&nbsp;</div><!--Clear floats-->
    </div>
    Then add this to your CSS:
    Code:
    .clearboth {
    	clear:both;
    	line-height:0; 
    	height:0;
    }
    Thats the method I personally use for clearing floats. Although someone may have a better more efficient way of doing things.

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2007
    Location
    Cambs/Norfolk, UK
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    BRILLIANT - worked a treat - thank you


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
  •