Need help with 3 columns

[shopfor2]

Hi again....I am really struggling with being able to use 3 columns in my website, whenever I get close, the page starts spliting apart? I have been trying to figure this out for days....I know, really dumb.

 

 

Anyway, if someone could please help me,

Thank you so much

 

I have posted my practice page www.portcharlesharbor.com/practicecss.html

and my css is;

 

/* CSS Document */

 

body {

 

background-color:#CCCCCC;

text-align:center;

}

 

 

#wrapper {

width:1010px;

margin:0 auto;

padding:10px;

}

 

 

#top {

width:1010px;

height:212px;

z-index:1;

}

 

 

#menu {

width:1010px;

height:53px;

 

}

 

#bodybase {

 

 

width:1010px;

height:633px;

z-index:1;

}

 

 

#leftcontent{

float:left;

margin:1em;

width: 8em;;

display:inline;

padding: 0;

}

 

#rightcontent{

float:right;

margin: 1em;;

width:10em;;

display:inline;

padding: 0;

}

 

#maincontent{

margin: 1em;

margin-left:10em;

margin-right: 10em;

}

 

 

#footer {

 

float-left;

width:1010px;

height:46px;

z-index:1;

}

 

 

 

.style8 {

font-family: Georgia, "Times New Roman", Times, serif;

font-weight: bold;

font-size: 14px;

color: #FFFFFF;

line-height:50px;

}

.style9 {

color: #FFFFFF;

font-family: Georgia, "Times New Roman", Times, serif;

line-height:35px;

 

}

a:link {

color: #FFFFFF;

font-weight: bold;

font-family: Georgia, "Times New Roman", Times, serif;

text-decoration: none;

}

a:visited {

color: #FFFFFF;

font-family: Georgia, "Times New Roman", Times, serif;

font-weight: bold;

text-decoration: none;

}

a:hover {

color: #FFFFFF;

font-family: Georgia, "Times New Roman", Times, serif;

font-weight: bold;

text-decoration: none;

}

a:active {

color: #FFFFFF;

font-family: Georgia, "Times New Roman", Times, serif;

font-weight: bold;

text-decoration: none;

}

[Andrea]

What do you mean by 'the page splitting apart'? It looks ok for me.

 

However, the better doctype to use is HTML strict, your navigation is a list and should be written as such, and all your styling is best done in your external stylesheet. Inline styling is really only for situation where one thing shows up only once on your entire site.

[shopfor2]

What I mean by splitting apart is, my menu div and bodybase div split apart showing a blank area inbetween the two.

 

What do you mean by "doctype to use is HTML strict" would that be in my external css sheet?

 

I know I need to change the menu to lists, just havent gotten to it yet.

 

I just really need to get my layout correct so I can move forward.

 

Thank you

 

Gina

[Andrea]

You're seeing the browser default settings - add:

* { margin: 0;

padding: 0;

}

to the top of your style sheet and the 'split' disappears.

 

The Doctype is declared in your HTML. First line.