PAGE-2: How do you make a 3 column with head and footer with css? related to border, width, stuff, footer

l33tg33k

Jan 2 2005, 11:59 AM

heard of google...??

nate9000

Jan 4 2005, 01:20 AM

Thanks a bunch!, i'v been wan'ting to make my own php portal system, but i don't have to much experiance with css, so you helped a bunch!

Comment/Reply (w/o sign-up)

wildteen88

Jan 4 2005, 03:50 PM

Isn't 1200 or sommit way too big! Especially for vistors with 800x600 screen resolutions! or 15" screens!

I recommend lowering the widths man! Althought you may have a bigger screen others may not have. Remember that dude!

Comment/Reply (w/o sign-up)

skyglow1

Jan 4 2005, 06:58 PM

Yeah I was wondering that too why it was so big. Maybe becuase most of his viewers have a higher resolution?

skyglow1

Comment/Reply (w/o sign-up)

Minisheep

Jan 5 2005, 11:57 AM

Hey ,don't you think that every element name must be lower case?

QUOTE

ehh, this isnt CSS, it is HTML, but

CODE

<HTML>

<HEAD>

<TITLE>

MY COOL TITLE GOES HERE!

</TITLE>

</HEAD>

<BODY>

<CENTER>

<TABLE BORDER=1 HEIGHT="100%" WIDTH="100%">

<TR>

<TH COLSPAN=3>

MY COOL HEADER HERE!

</TH>

</TR>

<TR>

<TD WIDTH="33%">

MY COOL COLUM #1 TEXT GOES HERE

</TD>

<TD WIDTH="34%">

MY COOL COLUM #2 TEXT GOES HERE

</TD>

<TD WIDTH="33%">

MY COOL COLUM #3 TEXT GOES HERE

</TD>

</TR>

<TR>

<TD COLSPAN=3>

<H6>

MY COOL FOOTER GOES HERE!

</H6>

</TD>

</TR>

</TABLE>

</CENTER>

</BODY>

</HTML>

just change the text

No he doesnt want 100% width, he wants 1200 in width. Your percentage values for the width are also wrong, the body is much wider than the side navigation. He wants 1800 altogether in height as well.

Here is the code you put in your CSS file called "layout.css":

CODE

#header { position:absolute; top:0; left:0; width:1200; height:200; border-style:solid; border-width:1; }

#footer { position:absolute; top:1600; left:0; width:1200; height:200; border-style:solid; border-width:1; }

#nav1 { position:absolute; top:200; left:0; width:200; height:1400; border-style:solid; border-width:1; }

#nav2 { position:absolute; top:200; left:1000; width:200; height:1400; border-style:solid; border-width:1; }

#body { position:absolute; top:200; left:200; width:800; height:1400; border-style:solid; border-width:1; }

In your index.html, or home page, put this:

CODE

<HTMl>

<HEAD>

<LINK rel="stylesheet" type="text/css" href="layout.css" title="default">

</HEAD>

<BODY>

<DIV id="header">

Stuff for Header

</DIV>

<DIV id="nav1">

Stuff for the left nav bar

</DIV>

<DIV id="body">

Stuff for the body

</DIV>

<DIV id="nav2">

Stuff for the right nac bar

</DIV>

<DIV id="footer">

Stuff for the footer

</DIV>

</BODY>

</HTML>

Here is what this code looks like, as a test:

http://www.skyglow1.freenukehosting.com/test.html

I am assuming the header is 200 in height, please tell me what it should be. Any changes you want, just ask. Also I need height of the footer at the bottom. If you don't like the border then tell me. Or if you don't want to seperate files then say that. ^^

skyglow1

Comment/Reply (w/o sign-up)

skyglow1

Jan 5 2005, 07:26 PM

Well, probably yes, but I ran it through the CSS checker and no warnings or errors turned up, so I guess its ok.

skyglow1

Comment/Reply (w/o sign-up)