css; background is being rubbish.

RandomTom · 23 Sep 2006 at 19:30

First of all the I have this current problem with http://upleft.co.uk, but I was going to re-do it anyway but I've come across the same problem

http://www.twobeds.com/upload/userfiles/RandomTom/upleft/test.html

You'll see in IE that the background re-applies itself to the width of the content, how can I get past this, I'm sure it's a simple question with a simple answer, thanks.

Code:

body, html {
	margin: 0 auto;
	padding: 0;
	width: 720px;
	color: #000;
	font: 0.9em tahoma;
	background: #F9F7EF url("images/test/grads.gif") repeat-x;
}
#wrap {
	padding-top: 260px;
	width: 720px;
	overflow:visible;
	margin: auto;
}

Sic · 23 Sep 2006 at 19:35

not entirely sure what you're saying, but i think you're saying that the background's repeating horizontally...that's what you're telling it to do with repeat-x...just change that to no-repeat (i haven't got IE so i can't see what it's doing

)

gord · 23 Sep 2006 at 19:39

Sic said:
not entirely sure what you're saying, but i think you're saying that the background's repeating horizontally...that's what you're telling it to do with repeat-x...just change that to no-repeat (i haven't got IE so i can't see what it's doing )

I doubt that, id hope he is a bit better than that.

I assume its the fact that the background is reapplying itself to his main content div?

gord · 23 Sep 2006 at 19:43

I would suggest trying two things, remove the html from your first css, make it separate if you want.. but im not too sure if that will do anything.

Secondly, you could try putting a background into your content id just leave it blank.

RandomTom · 23 Sep 2006 at 19:54

gord said:
I doubt that, id hope he is a bit better than that.

I assume its the fact that the background is reapplying itself to his main content div?

Yeh that's what I'm asking, I've usually had work arounds but with big noticable stripes like this its not. I do want it to repeat for the entire width of the upper section, but yes it's reapplying. I already have selected a background for the content area so that's why I'm a bit stumped.

edit: omg murder myself here! I only had to remove the 'width' from the html,body tag in the css, When I add floating images and the logo into that background I hope I'll have a decent enough work around by then, hmm...lol

RandomTom · 23 Sep 2006 at 20:02

Actually I need another way to do this, I still need the 720px width in the body or html tag because any images I put in won't sit right, and the footer line has extended to the entire page, hmm... :confused:

edit:

Code:

html {
	background: #F9F7EF url("images/test/grads.gif") repeat-x;
	font: 0.7em arial;
	color: #333;
}

body {
	margin: 0 auto;
	padding: 0;
	width: 720px;
}

FIXED

gord · 23 Sep 2006 at 21:33

Are you all sorted now then?

To be honest, i dont like having width in the body class.