...

View Full Version : 2 Background Images



Focus2k2
05-01-2006, 10:35 PM
got this small project today and was told it needs to be done by tonight. I'm trying to do some stuff with the background using CSS but i'm having some small problems.

The site is at
http://ottawabeachvolleyball.com/index2.html

StyleSheet is here
http://ottawabeachvolleyball.com/styles.css

Intially when it loads it looks fine. But once you scroll, the image of the net scrolls with the page. I want the to stay in the corner all the time.

I know i'm using tables... what a travesty... blah blah...

I am trying to switch over to complete css layouts but when projects like this come up, I don't have the time.

I've tried finding sites that do what I want but I couldn't find anything using 2 background images the way I want.

Thanks for any help.

_Aerospace_Eng_
05-01-2006, 10:58 PM
Add this to your CSS

html, body {
height:100%;
}
.net {
position:fixed;
bottom:0;
left:0;
}
Remove this from your style sheet

.net {
position: absolute;
z-index: 2;
left: 0px;
bottom: 0px;
}
Then after this

<link href="styles.css" rel="stylesheet" type="text/css">
add this

<!--[if lte IE 6]>
<style type="text/css">
html {
overflow-x:hidden;
overflow-y:hidden;
}
body {
overflow-y:auto;
}
.net {
position:absolute;
}
</style>
<![endif]-->
I hope you don't plan on using absolute or relative positioning for anything else on your page because anything else positioned absolute or relative it will now become fixed in IE meaning it won't scroll with the page. And its not that hard to code your layout without tables either. Basic two column layout, header, left nav, and content. http://bonrouge.com/2c-hf-fixed.php

Focus2k2
05-01-2006, 11:46 PM
That worked wonderfully in Firefox but I'm still having scrolling the problem in IE. Any suggestions?

And thanks for the link for the CSS layout. I won't be using it on this project but maybe on my next one. I've be learning CSS bit by bit. Basically trying to learn something new with each project.

My last option is basically to just tile the net image. I just want the effect for my own personal reasons, but if i can't pull it off it won't be the end of the world.

oldcrazylegs
05-03-2006, 11:42 PM
position:fixed does not work in ie. but you can get it to work kind of by using float.htc here

http://www.siteexperts.com/ie5/steveg/lpage8.asp

also see
http://www.idest.com/csshacks/files.htm



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum