2 replies [Last post]
zargon
zargon's picture
Offline
newbie
Last seen: 2 years 48 weeks ago
Timezone: GMT+1
Joined: 2007-10-20
Posts: 5
Points: 5

Hi guys,

I`ve just done my first website with HTML & CSS and was really happy that I`ve managed it so quickly (it`s simple and primitive but I do like it). Not until I opened it on another computer and I realized that it`s not finished at all....

So, I have a specific concern here, which I hope you can help me out with.

It`s about the composition of the background when opened in different resolutions

What I`ve done for the background is to safe 3 separate images:
1 image float:left
1 image float:right
1 image white gradient on top of both creating space for the conent and a smooth transitions between the two images.

some code snippets follow:

HTML:

<body>
 
<div id="background">
 
     <span id="bg"><img src="../images/content_bg.png" /></span>   
     <span id="left"><img src="../images/bar_right.png" /></span> 
    <span id="right"><img src="../images/bar_left.jpg" /></span>
 
</div>   

CSS:

#background {
	position:fixed;
	width:100%;
	z-index:-1;
	overflow:hidden;
}
 
 
#left{
	float:left;
	z-index:50;
}
 
#right {
	float:right;
	z-index:60;
}
 
#bg{
	position:fixed;
	left:-200px;
}

I`ve designed the whole thing on my 16" laptop and it looks ok, but when opened on a bigger screen, it all breaks.

So, how can I make it happen that no matter in what resolution the page is loded, the images in the background would arrange properly ?

thank you in advance guys!!!

zargon
zargon's picture
Offline
newbie
Last seen: 2 years 48 weeks ago
Timezone: GMT+1
Joined: 2007-10-20
Posts: 5
Points: 5

I forgot to give you the

I forgot to give you the address to check it out:

my web-page

//mod edit: link fixed --gt

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 11 hours 25 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9235
Points: 3241

Your page bears no

Your page bears no resemblance to your code snippet. The page uses pre 1999 markup.

Please get things sorted so we know where to begin.

cheers,

gary

Unplanned code results in a tangled wad of brain-cramping confusion.

There are enough html & css demos and tutorials to be interesting. Please visit.