Jump to content

Css Background Image Question.


Recommended Posts

Hi,Im having trouble setting my background image to scroll with the rest of the box element. So far it works perfectly in IE but for once its Firefox being a b*****d Ive tried using all background attack comands but nothing seems to help :/ive posted the element code below but if you need the whole style sheet to help please let me know. (website isnt live yet and i can publish it for awhile let)

.main{background-image:url('images/title-bg.jpg'); background-repeat:repeat-x;  width:518px; height:420px; float:right; clear:right; overflow: auto; position: relative;}

Any help would be very much appriciated.

Link to comment
Share on other sites

does the keyword scroll help?try:background:transparent url('images/title-bg.jpg') repeat-x scroll 0 0;
Nope, thats why im having so much trouble, background attachments just wont work in firefox for some reason. Ive pasted the whole style sheet below incase anyone can see any conflicts. (please forgive the messy code but ive not cleaned it up yet)
.whole{height:1000px; width:700px; margin: 0 auto 0 auto; position:relative;}.head{width:699px; height:156px; background-image:url('images/line1.jpg'); background-repeat:no-repeat; clear:both; border:0px; padding:0px;}	.head img	{margin-left:10px; vertical-align:middle;}	.head p	{text-align:center; color:#373737; font-size:8pt; font-family:Tahoma;}	.head a:link {color: #373737; text-decoration:none;}	.head a:visited {color: #373737; text-decoration:none;}	.head a:hover {color: #373737; text-decoration:underline;}.head2{width:699px; height:54px; clear:both; border:0px; padding:0px;}.nav{width:699px; height:50px; clear:right; border:0px; padding:0px; background-color:white;}.cats{width:181px; height:339px; background-image: url('images/cats-bg.jpg'); background-repeat:repeat-x; float:left; clear:left; border:0px; padding:0px; margin-bottom:0px;}	  .cats2	{margin-top:10px; margin-left:15px; list-style-type:square;}	.cats a	{text-decoration:none; padding-bottom:1px; border-bottom-style:solid; border-bottom-width:1px; border-bottom-color:#78a450; font-family: arial narrow; font-size:15px; color:white;}	.days	{height:81px; width:181px; background-image: url('images/7DAYS.jpg'); background-repeat:no-repeat; float:left; clear:left;}	.cats2 a:link {color: white;}	.cats2 a:visited {color: white;}	.cats2 a:hover {color: black; margin-left:10px;}.main{background-image:url('images/title-bg.jpg'); background-attachment:scroll; background-repeat:repeat-x;  width:518px; height:420px; float:right; clear:right; border:0px; padding:0px; margin-bottom:0px; overflow: auto; position: relative;}	.main h1	{margin:100px 330px 10px 25px; text-decoration:none; border-bottom-style:solid; border-bottom-width:2px; border-bottom-color:#e1d7bf; padding-bottom:5px; font-size:13pt; font-family:arial narrow; color:#d63500;}	.main h1 a:link {color:#d63500; text-decoration:none;}	.main h1 a:visited {color:#d63500; text-decoration:none;}	.main h1 a:hover {color:#d63500; text-decoration:none;}	.main h2	{color:#373737; font-size:10pt; font-family:Tahoma; margin:10px 25px 10px 25px; font-weight:bold;}	.main p	{color:#373737; font-size:8pt; font-family:Tahoma; margin:10px 25px 10px 25px;}.welcome h1{font-size:14pt; font-family:arial narrow; margin:10px 25px 10px 25px; color:#d63500; border: 0px; padding:0px; }	.welcome h2	{color:#black; font-size:8pt; font-family:Tahoma; margin:-13px 25px 10px 25px;}	  	.welcome p	{color:#373737; font-size:8pt; font-family:Tahoma; margin:10px 25px 80px 25px;}.line{width:468px; height:1px; margin:10px 25px 10px 25px; background-color:#e1d7bf; }.copyright{text-align:center; color:grey; font-size:8pt; font-family:arial narrow;}img{border: 0px 0px 0px 0px; }

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...