CSS and background repeating image tesselation

Sic

Sic

Soldato
Joined
9 Nov 2004
Posts
15,365
Location
SO16
i'm not entirely sure if/how this is possible, but i have a little problem. i have a small (8x8) image that i'm using to repeat as my main background...but i'd like to include it as part of my header image as well...like this:

header.png


but as you can see, it's shifting when it joins at the side. i'd move it, but it's by different amounts in different resolutions. is there anything i can do to make sure that it doesn't do this?
 
Where's the problem? That's a mock up I guess?

Make things transparent to show the pattern underneath, like around your head and the corners.

Edit: I see, having zoomed in enough. Yes make it a transparent gif (until png is supported) so the pattern comes through. I can have a go if youve got the files.
 
Hector said:
perhaps make the header using a .png with alpha so the background shows though it.
I suggested that, but I think ie doesn't support png still :/ Maybe 7 does. Edit: 7 does properly now.
 
Last edited:
there's very slight pixel shift, but it changes in different resolutions. i'd go for the transparency option, but it makes the edges so rough.
 
joeyjojo said:
I suggested that, but I think ie doesn't support png still :/ Maybe 7 does.
ah, i was just wondering why.. thats bad ain't it, png's are cool. worse still is i read about them back in 1998, in an ms press dhtml book no less.. whats up with 'em.

ps. i'm a slow poster, i only see your's after i clicked submit :o
 
Last edited:
Back
Top Bottom