Hey all, just coded a new design, useing images from Zymic (jack).
ALthough i coded it myself, to suit how i want my design.

Here is the css site:
http://www.nuweb.co.uk/firstcss/

Its a 3 colum website, i got the left and right working fine.
Although the middle, is supposed to be in the middle of the left and right clumb, although because i put it to be 100% it busts out.
Just like my girlfriend. HA.

Can anyone help me with ensureing that the div, stays between those 2 divs? .

Also, as you notice where it says "TEXT" this is where the titles will go, when i coded this in table format (http://www.nuweb.co.uk/firstcss/) the text was aligned to the bottom of the cell. I have tried alighing it, but it makes no difference in dreamwaver css.

Can anyone help me with putting the text to the bottom of the div?

After i have done these steps, im ready to implement it into my arcade!
Which is nice.

All you really need to do is give a width to div#content. Since you have the left and right menu each at 150px you could make the width of the content div somewhere around 450px and still have the site disply fine at 800x600 resolution.

I did notice that you have an id="contmain" applied 3 different times. If you want to apply those styles in more than one place it should be a class instead of an id. An id is meant to be used once and once only on a given page.

ahh realy, how do i change that?

I assume, i need to change id=
to class=

What about in the css file, do i change anything in their?

Thanks Vangogh for your help, about setting it to 450. ALthough this means its impossible to have 3 cloumb 100% designs. Shocking !"!"!"

I thought CSS was advanced html codeing, where as tables must be far more advanced.

I assume, i need to change id=
to class=

What about in the css file, do i change anything in their?

change the #name to .name

Thanks Vangogh for your help, about setting it to 450. ALthough this means its impossible to have 3 cloumb 100% designs. Shocking !"!"!"

Actually it's not impossible http://www.candsdesign.co.uk/article.../fluid-layout/

Thanks, if sussed it out now from that site above, and made it fluid.
Although im still unable to put the title text, on the bottom of the div.

Looks like Chris beat me to the answer to your div to class question. My answer was going to be exactly the same.

I'm not sure what the problem is with the title text. Which div are you trying to add it to? All of them? Is it still the same site you were were working on in the link at the start of the thread?

ok hey, im no pro like van, but i had a go at fixing it, and well i got it looking sweet. my experience is use % for navs and content areas, so i put your two navs at 15% each, thats about same size as you currently had them, then i put your content at 70% as 70+15+15=100%. and for your text problem. all you had to do was make a class ".class" and add some padding to the top. 4-5px would be good.

anyways i saved it, added it to a .RAR zip. and uploaded it to the server i practise my CSS on. here is the link http://www.lhost.info/hh121/website.rar : if you just want the CSS then here is the big code

CSS

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
text-align:center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
}

.text
{
padding:5px 0 0 0;
}
#main {
width: 99%;
background-image: url(images/bg.jpg);
border-top: 1px solid #000000;
}
#main2 {
width: 100%;
background-image: url(images/bg.jpg);
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

#silvbar {
height: 13px;
width: 100%;
border: 1px solid #000000;
background-image: url(images/silverbar.jpg);
border-top: 0px none #000000;
}

#bigorange {
background-color: #EC4801;
width: 100%;
border: 1px solid #000000;
border-top: 0px none #000000;
text-align: left;
}

#leftmenu {
float: left;
margin:-5px 0 0 0;
width: 15%;
}

#rightmenu {
float: right;
margin:-5px 0 0 0;
width: 15%;
}

#content {

}
#conttitle {
background-image: url(images/middle.JPG);
height: 16px;
width: 70%;
margin-top: 5px;
margin-bottom: 0px;
font-weight: bold;
text-transform: capitalize;
color: #000000;
border: 1px solid #000000;
}
#conttmain {
background-color: #EBEBEB;
width: 70%;
margin: 0px;
padding: 0px;
text-align: left;
vertical-align: top;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}
#conttbot {
background-image: url(images/silverbar.jpg);
width: 70%;
margin-bottom: 10px;
border: 1px solid #000000;
}

HTML

<!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=iso-8859-1"><title>Untitled Document</title>

<link rel="stylesheet" href="Untitled%20Document_files/css.css" type="text/css"></head><body>
<div id="main" align="center">
<div id="silvbar"> </div>
<div id="bigorange"><img src="http://www.webmaster-talk.com/images/logo.gif" alt="Welcome To FunShed" longdesc="http://www.FunShed.com" height="74" width="230"></div>
<div id="silvbar"> </div>

<div id="main2">


<div id="leftmenu">
<div id="conttitle">
<div class="text">Text</div>
</div><div id="conttmain">
Main
</div><div id="conttbot"></div>
</div>


<div id="rightmenu">
<div id="conttitle">
<div class="text">Text</div>
</div><div id="conttmain">
<div class="text">Text</div>
</div><div id="conttbot"></div>
</div>


<div id="content">
<div id="conttitle">
<div class="text">Text</div>
</div><div id="conttmain">
Main
</div><div id="conttbot"></div>

</div>


</div>

<div id="silvbar" style="border-top: 1px solid rgb(0, 0, 0);"> </div>
<div id="bigorange"><center>FunShed® Copyright © 2004-2006 and UK Propery Sorceing Ltd</center></div>
<div id="silvbar"> </div>
</div>

</body></html>

A way to make sure your middle stays inside your columns is also to use margin-right and margin left set to a few pixels larger than the widths of the columns. Don't use any % this should keep it inside provided your inside doesn't go beyond the width of the center area. The it'll probably start some overlapping issues.