tags:

views:

132

answers:

1

Hello,

Im trying to set it so I have a div in the middle set to 800px

and left hand div should be 100% and right hand div 100% so it repeats that background image.

My site http://www.craimarhotel.co.uk uses tables at the moment and im converting to CSS but cant work out the background.

Thanks in advance

A: 

I can see what you are trying to do but I don't think that 3 divs is the best way of doing this.

I have looked at your site and suggest the best way to do this is to 1) use one div centred in the middle for content.

2) combine your three background images into one large image which you would add as a background image to your body tag. (you will need photoshop for this - look at www.petstreet.co.uk for an example of how a background image can be used for this purpose)

3) I noticed you have a title which links to the home page. This could be added to another div at the top of the page with background set to transparent. (so that your desired background will show)

The other option is to use javascript to set the widths of your side divs depending on the users window size but I would not recommend that route.

I was playing with some code to test my solution. here it is

div.title{margin-right:auto;margin-left:auto;width:800px;height:100px;background:pink;margin-top:165px;}
div.middle{margin-right:auto;margin-left:auto;width:800px;height:500px;background:green;}

And within the body tag

<div class="title" ></div>
<div class="middle" ></div>

Hope that helps.

AJ Dhaliwal