Button Background Images Trouble in WinIE

circleandy

I got a set of links (Previous & Next) that have basically the same css styling. The only difference is that one has reversed images and reversed padding-left/right. Both buttons work in FF and Safari. However, only one works in WinIE. The "Next" button misaligns the sliding doors images, and I cannot figure out why. It's driving me nuts!

.html
.css
Code-stripped to minimum

Any advice would be appreciated.
Thanks!
-Andy

Apr 3 '07 #1

drhowarddrfine

I can't get my dev tool to work right with that page but I do notice your .buttonleft is floated while the right one is not. What happens if you float the right one left...or right.

Apr 3 '07 #2

AricC

I got a set of links (Previous & Next) that have basically the same css styling. The only difference is that one has reversed images and reversed padding-left/right. Both buttons work in FF and Safari. However, only one works in WinIE. The "Next" button misaligns the sliding doors images, and I cannot figure out why. It's driving me nuts!

.html
.css
Code-stripped to minimum

Any advice would be appreciated.
Thanks!
-Andy

Andy,
I'll look into this later tonite, but I have a question. I see the church's address is close to my location (Cincinnati) where is that city picture from? Certainly not Milfor Ohio. Just curious.

Apr 3 '07 #3

circleandy

I'm not sure where the image is from. It's just a place-holder. I think I figured out how to fix the problem, but I still don't know why I couldn't get it to work the way I had it.

I did have a rounded-on-both-sides green image on the "a:link," aligned to the left of the right button and the right of the left button. And I had a left arrow image on the ".leftbutton span," aligning to the left side. And I had a right arrow image on the ".rightbutton span," aligning to the right side.

I changed the design to use 4 images instead:

…and I used an unordered list instead of spans.

It seems that WinIE doesn't like sliding door where the top image is right-aligned.

Apr 3 '07 #4

drhowarddrfine

IE uses padding for some things while other browsers use margin. Or vice-versa. I know it's true of links so I'm wondering if it might be true here, also. I admit to being really, really lazy today.

Apr 3 '07 #5