2 replies [Last post]
Baluweb
Baluweb's picture
Offline
Regular
Last seen: 6 years 2 weeks ago
Timezone: GMT+1
Joined: 2007-04-28
Posts: 18
Points: 0

Hello

It should be very simlple, but...

Please take a look at this layout. Can someone tell me why it doesn't work like it should (there should be 3-column-layout with header above and footer beneath).

HTML:

Test









And CSS (taken from html-file's header):

html
{
margin: 0px;
padding: 0px;
}

body
{
margin: 0px;
body: 0px;
}

#head
{
height: 20px;
width: 800px;
margin: 0px auto;
background-color: #EDCEE7;
}

#content
{
width: 800px;
margin: 0px auto;
background-color: #C2E498;
}

#left
{
float: left;
width: 130px;
background-color: #BEBFF0;
height: 250px;
}

#middle
{
margin: 0px 150px 0px 130px;
background-color: #E5EDCE;
height: 300px;
}

#right
{
float: right;
width: 150px;
height: 200px;
background-color: #BEBFF0;
}

#foot
{
clear: both;
height: 20px;
width: 800px;
margin: 0px auto;
background-color: #EDCEE7;
}

Thanks for any answers,

Greetings Baluweb

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 13 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

For that set of rules to

For that set of rules to work as is you need to ensure both floats are first in the markup source before the #middle div is declared.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Baluweb
Baluweb's picture
Offline
Regular
Last seen: 6 years 2 weeks ago
Timezone: GMT+1
Joined: 2007-04-28
Posts: 18
Points: 0

Thanks

Thanks a lot!

Baluweb