taxgirl
07-31-2005, 08:12 PM
I'm having some problems with getting a Layer to appear properly on all webbrowsers.
It appears correctly on Internet Explorer, Opera, and AOL.
It appears incorrectly on FireFox and Netscape.
I've been messing with the coding and I've come close fixing it however I cannot get it to align properly in FireFox/Netscape without unaligning it on IE, AOL, and Opera.
<DIV id="content"
style="BORDER-RIGHT: #000000 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; Z-INDEX: 2; LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #000000 1px solid; WIDTH: 770px; COLOR: #000000; PADDING-TOP: 5px; BORDER-BOTTOM: #000000 1px solid; POSITION: absolute; TOP: 309px"></div>
That makes it appear like this on Firefox and Netscape:
http://img.photobucket.com/albums/v257/bethdogg/net-fire.jpg
(The top part is an Image with the beginning of the side border, the bottom is the Layer's Border)
And this is the correct display (as shown on IE, AOL, and Opera):
http://img.photobucket.com/albums/v257/bethdogg/ie-aol-opera.jpg
The Image side lines are supposed to be overlapped by the Layers border.
The border is 12pixels to the right of the image.
From the amount of pixels that it is off, I can only assume it is due to the 5pixel paddings on each side
PADDING-RIGHT: 5px; PADDING-LEFT: 5px;
and the Border width on each side
BORDER-RIGHT: #000000 1px solid; BORDER-LEFT: #000000 1px solid;
When I removed the padding the image and border came closer to aligning, they were (needless to say) 2 pixels off from overlapping.
http://img.photobucket.com/albums/v257/bethdogg/net-fire2.jpg
Now, I could easily solve this by eliminating the border, but that would defeat the purpose.
So what I'm asking is... does anyone know how to fix this problem without removing the border? Also, without the padding, as you know, the text is running from each side of the layer without a margin, so I need a way to fix this as well.
If you can help.. please... PLEASE do.
(if you need more information about the coding to solve this or need to look at the page in effect hit me on AIM -- TaxgirlSRH)
Thanks in advance if anyone can help!
It appears correctly on Internet Explorer, Opera, and AOL.
It appears incorrectly on FireFox and Netscape.
I've been messing with the coding and I've come close fixing it however I cannot get it to align properly in FireFox/Netscape without unaligning it on IE, AOL, and Opera.
<DIV id="content"
style="BORDER-RIGHT: #000000 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; Z-INDEX: 2; LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #000000 1px solid; WIDTH: 770px; COLOR: #000000; PADDING-TOP: 5px; BORDER-BOTTOM: #000000 1px solid; POSITION: absolute; TOP: 309px"></div>
That makes it appear like this on Firefox and Netscape:
http://img.photobucket.com/albums/v257/bethdogg/net-fire.jpg
(The top part is an Image with the beginning of the side border, the bottom is the Layer's Border)
And this is the correct display (as shown on IE, AOL, and Opera):
http://img.photobucket.com/albums/v257/bethdogg/ie-aol-opera.jpg
The Image side lines are supposed to be overlapped by the Layers border.
The border is 12pixels to the right of the image.
From the amount of pixels that it is off, I can only assume it is due to the 5pixel paddings on each side
PADDING-RIGHT: 5px; PADDING-LEFT: 5px;
and the Border width on each side
BORDER-RIGHT: #000000 1px solid; BORDER-LEFT: #000000 1px solid;
When I removed the padding the image and border came closer to aligning, they were (needless to say) 2 pixels off from overlapping.
http://img.photobucket.com/albums/v257/bethdogg/net-fire2.jpg
Now, I could easily solve this by eliminating the border, but that would defeat the purpose.
So what I'm asking is... does anyone know how to fix this problem without removing the border? Also, without the padding, as you know, the text is running from each side of the layer without a margin, so I need a way to fix this as well.
If you can help.. please... PLEASE do.
(if you need more information about the coding to solve this or need to look at the page in effect hit me on AIM -- TaxgirlSRH)
Thanks in advance if anyone can help!