A interesting issue

H

HazzaH

New Member
Goodevening all.

I've just been trying to bring down some file sizes for images on a website I am making, and I've just noticed something very frustrating (I'm using Dreamweaver CS5 just by the way).

I've just changed some .gif images to .jpg images; because they gave me smaller file sizes with better image quality. The site has a continuous background which matches up with sidebars on the css container to make the site appear seamlessly held in space by a network of pipes. It previews fine in Chrome and Internet Explorer; but the moment I try Firefox, there is a clear line where the background image and the sidebar images meet, but only for the top or bottom half of the side bar (depending on if the repeating background image is .jpg or .gif.)

I guess this is a pretty unique problem I've gotten myself into, but it's got me so baffled that I had to find an online community and ask.

Here I have highlighted the area I'm talking about. It's the kind of problem you can only see if you know it's there, and when you know it's there you can't stop looking at it.

http://i112.photobucket.com/albums/n185/TheHorrorblePlagueOf_2006/withproblem.jpg

http://i112.photobucket.com/albums/n185/TheHorrorblePlagueOf_2006/withoutproblem.jpg
 
Phreaddee

Phreaddee

Super Moderator
Staff member
well I couldn't notice anything where you had circled, however, you might want to look at where your address/nav is.
as there is a much more noticeable error there....
 
H

HazzaH

New Member
That's something else I wanted to ask. In Chrome, that bad lining up doesn't occur, but in IE and Firefox it does. If I move it to match up in the other two, it comes apart in Chrome.
 
S

shovenose

Banned
Chrome is not a very standards compliant browser. Try to code to Firefox, then fix it so it works in IE and chrome. Opera is usually very standards compliant too...
 
Phreaddee

Phreaddee

Super Moderator
Staff member
Chrome is not a very standards compliant browser.
Click to expand...
chrome is quite the standards browser. It's just not as forgiving as firefox is with errors. so breaking is more your code being incorrect than the browser not being standards compliant. not sure where shovenose got that from...
 
Last edited:
S

Sogo7

New Member
Without a link to a live webpage so I can look at the code it's hard to say.

Are you using tables or CSS to control the page layout?
 
krymson

krymson

Member
i would say as far as the part that you have circled...you are not saving them to be optimized you are just changing the extensions because of the minor size difference. open the gif up in photoshop, and save it for web and devices. you will not lose any quality and the file will be WAY smaller than what you're doing right now. that's what you need to do.
 
H

HazzaH

New Member
I did code using chrome as my standard browser for previews
I used css for my layout.
I did save the images for web and devices.
 
K

kohncreative

New Member
Make sure when you're exporting from photoshop, that the edge of your background graphic does not have any 'haze' to it, and that it is the exact same gradient as the foreground image.
 
You must log in or register to reply here.
Top