12 replies [Last post]
jck
Offline
newbie
Last seen: 14 years 3 weeks ago
Joined: 2008-11-11
Posts: 4
Points: 0

Scenario: I am creating a .net web site in visual studio 2008 WD. I have one main css file (ironically named main.css) which I am using for all pages with some CSS mixed in Div elements etc.
Problem/Question I made a gradient(20px by 600px) image which I want to repeat across the x-axis. My css code works fine in firefox but not in IE6 or IE7(have not tested any other browsers)

body {background:#000000;
background-image:url("images/Vil_Fade_Vert.jpg"); 
background-repeat:repeat-x;}
I have also tried body { background:#fff url('images/Vil_Fade_Vert.jpg') repeat-x} along with some other combinations I have also applied these properties using a css class instead with the same properties. Not that I think there is a difference but I have been trying everything. I have searched this topic extensively and have not been able to find a solution. Any help would be greatly appreciated.

Thanks.

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 10 years 19 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

You don't say what is not

You don't say what is not working, e.g. image not appearing at all, appearing but in the wrong place, appearing but not repeating. A link to the page is always helpful.

Some notes:
- quotes aren't required.
- specify where you want the image to appear, e.g. top or bottom. Iirc background-position defaults to center center.

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 11 years 14 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

When something is repeating

When something is repeating on the x-axis, the default horizontal value (and unchangeable) is left.
When something is repeating on the y-axis, the default vertical value (and unchangeable) is top.

As far as I know though the other value will do something, but if it's not stated it's assumed to be 0 0 (left top).

On something not repeating, the default is still 0 0 but if one value is set the other is supposed to default to "center"... but!
IE is a tard. If you state one position (on something not repeating) it should assume the other is "center" by default however IE really really really wants you to state the other explicitly.

If the OP could post some code, we could see if maybe if something...

Quote:

which I am using for all pages with some CSS mixed in Div elements etc.

is interfering... does the above sentence mean, there are some inline styles?

This

body { background:#fff url('images/Vil_Fade_Vert.jpg') repeat-x}

should have worked (even though, yeah, you don't need the quotes and you should get in the habit of closing all your declarations with ; )
however something just occured to me...

I've heard many people looking in IE on local files and cannot see any images ever at all. Once the page is uploaded to a server, the images magically show. Could this be the problem (I don't know the cause of it, I just remember seeing a lot of people with it)?

I'm no expert, but I fake one on teh Internets

jck
Offline
newbie
Last seen: 14 years 3 weeks ago
Joined: 2008-11-11
Posts: 4
Points: 0

The image is displayed and

The image is displayed and repeated in firefox. In IE7 the image does not appear anywhere. thanks. I have put the page on a server with the same result. Yes inline styles nothing should be affected since they are primarly Bg colors font sizes etc.

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 11 years 14 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

Well, now, a background

Well, now, a background colour could be covering (overriding) a background image. Internal styles override everything except user stylesheets.

If it's still like that on the server, then it's in the code. We'd need to see all of it (or, all that's relevant, HTML and CSS... because someone's gotta be overriding someone else. Plus, it's evil to add inline styles. They are the source of all darkness in the world. : )

I'm no expert, but I fake one on teh Internets

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 8 years 3 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Chris requested a link

Chris requested a link earlier, you have stated it's up on a server, where the link :shrug:

Initially always try and use the property shorthand declarations as they are generally considered safer, use the constituent property parts only when needing to overide something specific.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

jck
Offline
newbie
Last seen: 14 years 3 weeks ago
Joined: 2008-11-11
Posts: 4
Points: 0

http://www.villagersrestauran

http://www.villagersrestaurant.com/
i have opened the site back up. please keep in mind this is nowhere near complete.
http://www.villagersrestaurant.com/test.html

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 10 years 19 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

jck

jck wrote:

http://www.villagersrestaurant.com/
i have opened the site back up. please keep in mind this is nowhere near complete.

Don't worry about that. We'll only be looking at the problem not other parts you've not asked about - mostly Wink

IE can't display the image, it finds/retrieves it no problem. There is something wonky™ about the image. I saved it locally just to be certain and tried loading it in IE - no go. However, after opening it in photoshop and then saving it for web, it works fine in IE.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 47 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Chris is right; you've saved

Chris is right; you've saved the image as a cmyk for print/separation rather than rgb.

gt@aretha:~$ identify -verbose <a href="http://www.villagersrestaurant.com/images/Vil_Fade_Vert.jpg
Image:" rel="nofollow">http://www.villagersrestaurant.com/images/Vil_Fade_Vert.jpg
Image:</a> /tmp/magick-XX2xZAc5
  Base filename: Vil_Fade_Vert.jpg
  Format: HTTP (Uniform Resource Locator (http://))
  Class: DirectClass
  Geometry: 10x700+0+0
  <span style="color:red">Type: ColorSeparation</span>
  Endianess: Undefined
  <span style="color:red">Colorspace: CMYK</span>
  Depth: 8-bit
  ...
Resave as an RGB image, and all should be well.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 11 years 14 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

Oh lawlz! I learn something

Oh lawlz! I learn something new every day... so, IE is the only browser who cannot deal with an image whose colours are CYMK?? I didn't know it would ever have a problem with it.

I'm no expert, but I fake one on teh Internets

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 47 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Stomme poes wrote:Oh lawlz!

Stomme poes wrote:

Oh lawlz! … IE is the only browser who cannot deal with an image whose colours are CYMK?? …

I've seen it a time or three. So far as I know, IE is the only one of the Big 4 that has trouble.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 11 years 14 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

For the first time, I'm glad

For the first time, I'm glad GIMP doesn't really do CYMK (there's an option somewhere but it's bagger).

I'm no expert, but I fake one on teh Internets

jck
Offline
newbie
Last seen: 14 years 3 weeks ago
Joined: 2008-11-11
Posts: 4
Points: 0

Now that is something I

Now that is something I didn't even consider, and did not know about. I finally got a chance to try that and sure enough everything works fine. Thank you very much.