Please use a more specific subject line. I feel your pain, but I assure 
you, that's the normal feeling when dealing with IE.


Suzanne Goodwin wrote:
> I like the look of the updated tabs on veer.com, so I wanted to see if I 
> could do it with CSS only (OK, I *did* use Dean Edwards IE7 scripts, 
> hoping to avoid IE problems, since that gives me :hover support and 
> transparent pngs)... I did fine as far as all non-IE browsers are 
> concerned, but of course nothing works in IE, and I can't for the life 
> of me figure out why. I feel it must be something obvious I'm 
> overlooking. If anyone has time to take a look, I'd sure appreciate it:
> 
> http://www.skydogtech.com/aveksa/nav_main.html
> 

To go:
"Because a filter is not a real background image, it cannot be offset 
using background-position nor can it be tiled using background-repeat" [1].


For your tabbed navigation, you are using

background: transparent url('exceptions-trans.png') no-repeat scroll 
right top;

but right top is not supported. Give the element a width of the image 
used (approx. 125px), the IE7 works well and shows the curved edge 
tranparency.


The reason:
IE7 replaces

background: transparent url('home-trans.png') no-repeat scroll right top;

by

background: transparent no-repeat scroll right top;
filter: 
progid:DXImageTransform.Microsoft.AlphaImageLoader(src='home-trans.png', 
sizingMethod='scale')";
zoom:1;

A filter is an object that cannot be tiled or offset. There is 
physically no background-image anymore to position. Your layout is not 
possible. Unless Dean is doing more magic than usual, this cannot be 
achieved with IE6.

To position a filter, he would have to insert a span, apply the filter 
to it, give it a specific width, and move it aside while cropping it 
with overflow:hidden applied to the parent ... forget it.

(This MS proprietary filter thingy does apply to layout elements only, 
therefore, in case someone is still reading, Dean applies the zoom:1, 
now that IE renders inline elements with "layout" more like inline-block 
[2].)

regards
Ingo


[1] http://dean.edwards.name/IE7/notes/#PNG
[2] http://www.satzansatz.de/cssd/onhavinglayout.html

-- 
http://www.satzansatz.de/css.html
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to