Transparency Trouble, Pixelated white boreder around image Options

[LolitaDoll]

Hi,

My main image of my layout is a sorta of weird hearts shape and my background is a patterened gradient. I wanted to make my main image transparent so that the background will show through. In photoshop i went to save for web and I've tried heaps of different png and gif settings but i always gets this thin pixelated white border around my image. Does anyone know what settings I should be using to get rid of it?

Thanks in advance,

LD ^-^

[1angel3]

I always have that problem too, I just put the image on the background, making the background part of the header. I also give my container a background and make it reapeat-y and continue the background with the content area.



sorry if that don't make sense

[LolitaDoll]

No that made sense.

I tried doing somethng simalar to that but where the image ends and meets up with the background half the pattern is cut off. Like it just doesn't flow, if that makes sense lol.

I'm hoping someone knows what settings will get rid of that damn pixeled border though.

[1angel3]

You know what, it takes time but you have to remember where you cut off the picture. Try using the selection tool and paste the rest in another canvas and save them both

[LolitaDoll]

No what I mean is that when i save my image with the patterned gradient behind it then put it into my coding with the body background as the patterend gradient, there is a line where you can see that it doesn't flow. like the main image that has been saved with the patterned background covers up half the pattern of the body background so it doesn't look like it flows on right. Here's a pic of what I mean.



So yeah I just want to save my main image (all the hearts) as a transparent image (either .png or .gif) without the white pixel border then add my patterened gradient bg in my html code.

[1angel3]

Oh thats pretty, its not that noticeable, I had to look hard, this what I was talking about.

the white part represent the image/header

The second part is the continue

Here is the code

CODE

<body bgcolor="#ffffff" topmargin="0" leftmargin="0" background="The repeated image url here" style="background-repeat:repeat-y;">
<img src="header image url here" border="0">

Thats how I do it, refer to my layout here