www.webdeveloper.com
Results 1 to 4 of 4

Thread: More than 3 sections within a wrapper....

  1. #1
    br3nt is offline Prefered Language :: HTML
    Join Date
    Apr 2007
    Location
    Ohio
    Posts
    20

    More than 3 sections within a wrapper....

    Okay, so no matter what I do I can never get more than 3 divs inside of a wrapper! I play with the sizes to make sure it's not getting bumped out or something, nothing will work!

    Code:
    body {
    	background-color:#000000;
    }
    
    .wrapper {
    	background-color:#151515;
    	width:850px;
    	height:570px;
    	margin:0 auto;
    	border:1px #f1f1f1 solid;
    	padding:0px;
    }
    
    .header {
    	background-color:#232323;
    	width:700px;
    	height:80px;
    	margin-top:10px;
    	margin-left:10px;
    	padding:0px;
    
    }
    
    .left {
    	background-color:#232323;
    	width:170px;
    	height:460px;
    	margin-top:10px;
    	margin-left:10px;
    	padding:0px;
    	float:left;
    }
    
    .mid {
    	background-color:#232323;
    	width:520px;
    	height:460px;
    	margin-top:10px;
    	margin-left:190px;
    	padding:0px;
    }
    
    .right {
    	background-color:#232323;
    	width:120px;
    	height:570px;
    	margin-top:10px;
    	margin-right:10px;
    	float:right;
    }
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <meta content="en-us" http-equiv="Content-Language" />
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>Untitled 1</title>
    <link rel="stylesheet" href="style.css" />
    </head>
    
    <body>
    <div class="wrapper">
    	<div class="header"></div>
    		<div class="left"></div>
    			<div class="mid"></div>
    				<div class="right"></div>
    </div>
    </body>
    
    </html>

  2. #2
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,478
    Hi there br3nt,

    try it like this...
    Code:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title>Untitled 1</title>
    
    <style type="text/css">
    body {
        /*background-color:#000000;*/ background-color:#000;
     }
    #wrapper {  
        background-color:#151515;
        /*width:850px;*/  width:830px;
        /*height:570px;*/ height:550px;
        /*margin:0 auto;*/  margin:auto;
        /*border:1px #f1f1f1 solid;*/  border:1px solid #f1f1f1;
        /*padding:0px;*/  padding:10px;
     }
    #right {
        background-color:#232323;
        width:120px;
        /*height:570px;*/  height:550px;
        /*margin-top:10px;*/
        /*margin-right:10px;*/
        float:right;
     }
    #header {
        background-color:#232323;
        width:700px;
        height:80px;
        /*margin-top:10px;*/
        /*margin-left:10px;*/
        /*padding:0px;*/
        float:left;
     }
    #left {
        background-color:#232323;
        width:170px;
        height:460px;
        margin-top:10px;
        /*margin-left:10px;*/
        /*padding:0px;*/
        float:left;
     }
    
    #mid {
        background-color:#232323;
        width:520px;
        height:460px;
        margin-top:10px;
        /*margin-left:190px;*/  margin-left:10px;
        /*padding:0px;*/
        float:left;
     }
    </style>
    
    </head>
    <body>
    
    <div id="wrapper">
    
    <div id="right"></div>
    
    <div id="header"></div>
    
    <div id="left"></div>
    
    <div id="mid"></div>
    
    </div>
    
    </body>
    </html>
    
    coothead

  3. #3
    br3nt is offline Prefered Language :: HTML
    Join Date
    Apr 2007
    Location
    Ohio
    Posts
    20
    Thank you! That worked perfectly! What did you change? Just copy-paste into the header instead of referencing it?

  4. #4
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,478
    Hi there br3nt,
    What did you change?
    I have have highlighted the changes in purple.

    coothead

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles