/    Sign up×
Community /Pin to ProfileBookmark

More than 3 sections within a wrapper….

Copy linkTweet thisAlerts:
Aug 29.2009

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]

[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>
[/CODE]

to post a comment
CSS

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@cootheadAug 30.2009 — Hi there br3nt,

try it like this...
[color=navy]
[color=purple]&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt;
&lt;html lang="en"&gt;
&lt;head&gt;

&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
&lt;meta name="language" content="english"&gt;
&lt;meta http-equiv="Content-Style-Type" content="text/css"&gt;
[/color]
&lt;title&gt;Untitled 1&lt;/title&gt;

&lt;style type="text/css"&gt;
body {
/*background-color:#000000;*/ [color=purple]background-color:#000;[/color]
}
[color=purple]#[/color]wrapper { <br/>
background-color:#151515;
/*width:850px;*/ [color=purple]width:830px;[/color]
/*height:570px;*/ [color=purple]height:550px;[/color]
/*margin:0 auto;*/ [color=purple]margin:auto;[/color]
/*border:1px #f1f1f1 solid;*/ [color=purple]border:1px solid #f1f1f1;[/color]
/*padding:0px;*/ [color=purple]padding:10px;[/color]
}
[color=purple]#[/color]right {
background-color:#232323;
width:120px;
/*height:570px;*/ [color=purple]height:550px;[/color]
/*margin-top:10px;*/
/*margin-right:10px;*/
float:right;
}
[color=purple]#[/color]header {
background-color:#232323;
width:700px;
height:80px;
/*margin-top:10px;*/
/*margin-left:10px;*/
/*padding:0px;*/
[color=purple]float:left;[/color]
}
[color=purple]#[/color]left {
background-color:#232323;
width:170px;
height:460px;
margin-top:10px;
/*margin-left:10px;*/
/*padding:0px;*/
float:left;
}

[color=purple]#[/color]mid {
background-color:#232323;
width:520px;
height:460px;
margin-top:10px;
/*margin-left:190px;*/ [color=purple]margin-left:10px;[/color]
/*padding:0px;*/
[color=purple]float:left;[/color]
}
&lt;/style&gt;

&lt;/head&gt;
&lt;body&gt;

&lt;div [color=purple]id[/color]="wrapper"&gt;
[color=purple]
&lt;div [color=green]id[/color]="right"&gt;&lt;/div&gt;
[/color]
&lt;div [color=purple]id[/color]="header"&gt;&lt;/div&gt;

&lt;div [color=purple]id[/color]="left"&gt;&lt;/div&gt;

&lt;div [color=purple]id[/color]="mid"&gt;&lt;/div&gt;

&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;
[/color]
[i]coothead[/i]
Copy linkTweet thisAlerts:
@br3ntauthorAug 30.2009 — Thank you! That worked perfectly! What did you change? Just copy-paste into the header instead of referencing it?
Copy linkTweet thisAlerts:
@cootheadAug 30.2009 — Hi there br3nt,
[color=navy]What did you change? [/color][/quote]
I have have highlighted the changes in purple. ?

[i]coothead[/i]
×

Success!

Help @br3nt spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 4.29,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...