Hi

CSS Newb so please be gentle. I've previously used tables in abundance and have decided to try and get with the times,

I downloaded this template and started making amendments to it:

http://www.geocities.com/emma_hanby/index2.html

I would like to start adding pages, but would like to extend the white box to go the whole width of the whole red block. I will delete the image to the right.

How would i extend the box? is it something i need to enter in the style sheet i can use to refer to resizing the box and only refer to it on the new html page?

thanks

In the CSS, change the width on the #main div to 700px, equal to the width of the #wrapper (red)

#main {
width: 350px; /*change this width */

padding-left: 15px;
padding-right: 5px;
float: left;
line-height: 18px;
padding-top: 10px;
height: auto;
}

Thanks! you're too kind. But, it only moved the text and didnt extend the white box

Can i create another css file and link it to the new html page?

so the css for the index.html will be default.css and a new one linking to page one.html, two.html etc will be default2.css.

would this work?

cheers

Won't make any difference. That white 'box' is actually the background image for #wrapper.

Soo... in order to combat that, you can add this to the rules for #main -
background: #ffffff; - that will make the whole box white where now it is transparent. You'll also have to remove the #outer div that that side image is sitting in.