Main page background image problem!

[tsaurus]

Hi guys,

Working on a customisation of the gloss_blue template but have one problem. I'm trying to put in a background image for the main page (center column), but this template seems to have set the image to 100% with, whilst I want to set it to a certain size like 700px.

Can anyone tell me where in the code I can go to to fix this?

Cheers

Tsaurus

ps, see attached image

[kobra]

Almost all the styling can be controlled by editing the stylesheet.css file located in the includes/templates/template_default/css folder...make a copy to your template file and edit the copy. Use the override system.

Then look for mainWrapper. and it is most likely 100% so set it to 75% or a defined number of px.

[tsaurus]

Thanks Kobra

Unfortunately I have already tried that, the mainwrapper width setting seems to control the entire page width, left and right columns included. I think this has something to do with this particular template as it was originally designed for 100% width?

Where else could I go to find the width setting for the center column only?

[kobra]

Check these classes & ID's for settings, marging & padding:

.centerColumn
.centerBoxHeading

I also did not see any sideboxes in your pic...do you not have any displaying? If not have you turned off the left & right columns globally in admin > config > layout settings?

[tsaurus]

Thanks Kobra

Yeah I've deliberately left the sideboxes out yet, still playing with the main design first before I work on them.

Could you please explain what I should do with the class and id settings? I'm not familiar with them yet...still learning :)

[kobra]

Got a url?? As this gets you more direct responses

can post it like mydomain dot com

[tsaurus]

Yeah,

www.goodair.com.au

I'm actually modelling the appearance of the site like mydomain's atm while figuring out how to customise the css etc.

And also, how can I adjust the header width so the header background image isnt covered by the nav bar?

[kobra]

Not sure of what you are trying to set the width of??
The center area takes up what the left & right columns do not and this is how it is displaying.

You have actually coded around the default function by inserting tables into the center content area
Partial or snippett:

<td colspan="2" style="border-style: none; border-width: medium" bgcolor="#eeeeee" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000">

As such, this defines the table that you have created and circumvents using css to style. The gray color is called out in you table description along with other things..

You can use tables, but there is not a need for this and ZC is now div based and you have reverted back to tables.

[tsaurus]

ok Ill have a go removing the tables.

Basically what I'm trying to achieve is to put up a background image of a 3d box with a soft shadow for the main page in the center column. Therefore everything in the center column pages will show ontop of this box background just to give it a 3rd feel...atm whenever I try and do that, the code stretches that image to the entire page width not making this possible.

I haven't put up the box image yet as I need to figure this out..

are the tables I am using causing this?

[kobra]

Give the dimentions of this 3rd image...

Usually a background image would be a gradient and something like 2-5px wide and 700-800 px high...you would define as a background image and repeat-x