[Help] Coding A 3 Colum Layout Using Css, Html, Etc..

[SIZE="1"]Okay I Need Help.
I Want Tooh Get Into Coding Layouts.
For Habbo Hotel Section. But I Cant Seem To Understand Any Tutorials On 3 Colum Css Layout Making.
I Know Advanced Html.. And Css Im Familiar With.
But I Just Cant My Brain Starts To Hurt And I Get Side Tracked.

If There Are Tutorials On Rz Already, Can Post Link?

&&

If Not Can Give Me Some Tips, Other Good Tuts Over Web?
Step By Step Helping Me?


Thanks Much Appreciated.

Regards,
PixelPie.



Edit: Here Are Some ExampleS Of What I Would Like Tooh Atempt.
HabboTalk lets talk about Habbo
[url=http://habbots.net/]Habbots

That's just a portal isn't it? What kinda forums are you using?

Okay, i being totally honest with you, but i think i can figure out what your after, but i haven't coded it in CSS just normal HTML.

Code:

---

<table align="center">
<tr>
<td>
Logo
</td>
</tr>
</table>
<table align="left">
<tr>
<td>
Left Nav
</td>
</tr>
</table>
<table align="right">
<tr>
<td>
Right Nav
</td>
</tr>
<table>
<table align="center">
<tr>
<td>
Empty Space - I would use this for Content Reading for the below such as "NEWS"
</td>
</tr>
</table>
<table align="center">
<tr>
<td>
Content
</td>
</tr>
</table>

---

Copy that, add it to a html file, then edit whatever you want. (Use CSS to keep it neat :smile: )

@Oreo Sorry I Dont Understand What You Mean.

@Greg Thanks That Broke It Into 3 Colums For Me. Thats A Start.
Really Appreciated.

Nvm =[

What Oreo ment was like a pre-made web design for habbo users, such as PHP NUKE and vBadadvance and stuff. Thats what he means about a portal i think.

Yea.. I thought he just wanted a basic portal, becuase that's exactly what portals do, and they bring in the information automatically.. But nvm you helped him greg =p

@Oreo Lawlz. ='[

@Greg Like A Alreayd Uncoded Sliced Layout? With Teh Images? Or Like Somthing Already Coded That I Have Tooh Insert My Information.

PHPNUKE is a Portal! It contains a WYSIWYG editor and automatically posts information when you submit them using its features.

If you want a Portal, you need to know PHP and design it yourself, but i consider using your own template, slide it, and re-code it all.

(PHPNUKE is FREE! But its not good for Habbo, only Content Managing)

LoL that's true =]

@Greg Ohhh So PhpNuke Is Basically Not Helpful Right Now. That I Should Start To Code It Using Html And Css Too Make It Neat.
Okay I Understand Now.
The Way Tutorials Made It Seem Was That I Had To Code The Whole thing In Just Css.
Thanks Anyway.

@Oreo Offtopic: I Love Your Forum Name. xD

Edit: Completley Offtopic But I Dont Wanna Make New Thread For One Question.
Sso Login What Is That?
Can It Connect Tooh A .Exe Program On My Computer?
While My Comp Is Off.

Regards,
PixelPie

A login? If you want a login you are going to know how to use PHP and MySQL. A .exe cannot be ran while your computer is turned off. And having a .exe as a login for other people is really risky and i doubt its even possible to do.

Ok this is a sample of a XHTML 3column layout
HTML

Code:

---

<div id="wrapper"><!-- Open Wrapper -->
        <div id="header">Header text</div>
        <div id="content"><!-- Open Content -->
                <div id="left">Left content</div>
                <div id="center">Center content</div>
                <div id="right">Left content</div>
        </div><!-- Close Content -->
</div><!-- Close Wrapper -->

---

CSS

Code:

---

#wrapper {
        width:800px;
        margin:0 auto;
}
#wrapper #header {
        width:100%;
}
#wrapper #content {
        width:100%;
}
#wrapper #content #left {
        width:20%;
        float:left;
        border-left:1px solid #000;
}
#wrapper #content #center {
        width:59%;
        float:left;
}
#wrapper #content #right {
        width:20%;
        float:left;
        border-right:1px solid #000;
}

---

As you can see its as simpel as it gets, from there u can play around with it and stuff...

Except that no browsers in the world support XHTML.

Use tables, no matter what the fanatics says.

Quote:

---

Originally Posted by greg

Okay, i being totally honest with you, but i think i can figure out what your after, but i haven't coded it in CSS just normal HTML.

Code:

---

<table align="center">
<tr>
<td>
Logo
</td>
</tr>
</table>
<table align="left">
<tr>
<td>
Left Nav
</td>
</tr>
</table>
<table align="right">
<tr>
<td>
Right Nav
</td>
</tr>
<table>
<table align="center">
<tr>
<td>
Empty Space - I would use this for Content Reading for the below such as "NEWS"
</td>
</tr>
</table>
<table align="center">
<tr>
<td>
Content
</td>
</tr>
</table>

---

Copy that, add it to a html file, then edit whatever you want. (Use CSS to keep it neat :smile: )

---

Thats Not the best way to do it.. Tables are meant for tabular data not layouts
this is how it should be done

PHP 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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
.leftside{
background:#00FF99;
float:left;
width:295px;
margin-right:0px;
height:500px;
}
.rightside{
background:#CCFF33;
float:right;
width:295px;
margin-left:5px;
height:500px;
}
.colcenter{
background:#252525;
margin:auto;
width:400px;
height:500px;
}


-->
</style></head>

<body>

<div class="leftside">This is a left column Floated with CSS</div>
<div class="rightside">This is a right colum Floated by csss</div>
<div class="colcenter">This is a centered colum with CSS</div>
</body>
</html> 


---

Quote:

---

Originally Posted by DeathArt

Except that no browsers in the world support XHTML.

Use tables, no matter what the fanatics says.

---

you sir are WRONG
all browsers support Xhtml. its one of the most common forms of HTML
and Tables as i said above are meant for TABULAR DATA not for layouts. If you wanna learn to code learn to do it right or dont do it at all.

@Darth i never thought of doing it that way thanks :)

@kip0130 the way u use css works, but u will get problems with using multiple backgrounds and making fluid layouts

@DeathArt as kip0130 said all browsers support xhtml, but on each browser theres always diferent error or ways to do stuff.