Question

Ok I am making a simulated OS type interface. It should open up windows and have a drag handle. This all works perfectly. Then I added a image for an exit button I floated to the right… this made IE mad and IE screwed with the sizing and positioning =[

I’ve tried a crap load of things. None of which work. Anyone wana help?

website is

http://opentech.durhamcollege.ca/~intn2201/brittains/labs/

Thanks
Shelby

Answer 1

It’s an issue with IE 6 & 7:
http://blogs.msdn.com/askie/archive/2009/03/23/right-floated-element-in-internet-explorer-8-is-positioned-differently-than-internet-explorer-7.aspx

The only solution I can come up with is something like:

<!--[if lte IE 7]>
    <style type = "text/css">
        #windowExitImage{margin-top:-27px}
    </style>
<![endif]-->

Because it’s technically a comment, only IE 7 on back will pay attention to that. So IE 8 and other browsers will display it the way they already do, which does in fact look right.
http://css-tricks.com/how-to-create-an-ie-only-stylesheet/