css layout - where to start from?

Forum Home

FAQ

Memberlist

Profile

Register - Not registered yet? Got something to say? Join HTML Code Tutorial!

css layout - where to start from?

HTML Help Forum Index -> CSS

View previous topic :: View next topic

Author

Message

beginner.html

Joined: 02 Aug 2007
Posts: 365

Posted: Sun Mar 09, 2008 5:29 pm css layout - where to start from?

I want to check out this css layout to see what it looks like on browser. Where do I start from?

Code:

<div id="container">
<div id="header">
Header
</div>
<div id="leftBar">
Left Bar
</div>
<div id="content">
Main Content
</div>
<div id="rightBar">
Right Bar
</div>
<div id="footer">
Footer
</div>
</div>

#container {
margin:auto;
width: 760px;
background: #ffffff;
}

#header {
background: #DDDDDD;
}

#leftBar {
float: left;
width: 150px;
background: #EBEBEB;
}

#content {
float:left;
width:450px;
background-color: #cdcde6;
}

#rightBar {
float:right;
width: 160px;
background: #EBEBEB;
}

#footer {
clear:both;
background:#DDDDDD;
}

I think I will need the basics first :

Code:

<html>
<head>
<title>title</title>
</head>
</html>

<body>

ogsolution

Joined: 26 Dec 2007
Posts: 144

Posted: Sun Mar 09, 2008 8:18 pm

something like this...

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title></title>
<style type="text/css">
#container {
margin:auto;
width: 760px;
background: #ffffff;
}

#header {
background: #DDDDDD;
}

#leftBar {
float: left;
width: 150px;
background: #EBEBEB;
}

#content {
float:left;
width:450px;
background-color: #cdcde6;
}

#rightBar {
float:right;
width: 160px;
background: #EBEBEB;
}

#footer {
clear:both;
background:#DDDDDD;
}
</style>
</head>

<body>

<div id="container">
<div id="header">
Header
</div>
<div id="leftBar">
Left Bar
</div>
<div id="content">
Main Content
</div>
<div id="rightBar">
Right Bar
</div>
<div id="footer">
Footer
</div>
</div>

</body>
</html>

beginner.html

Joined: 02 Aug 2007
Posts: 365

Posted: Mon Mar 10, 2008 7:28 am

Ok cool. Thanks.

Display posts from previous:

	HTML Help Forum Index -> CSS	All times are GMT - 8 Hours
Page 1 of 1

You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

Your Ad Here

HOSTING / DESIGN

$1.99 Domain Registration
Cheap Web Hosting
Website Templates

MAKE MONEY

Sell Domain Names
Sell Website Templates

| | | | |