-1

I have a problem with *zoom in IE9+
What is the solution for this?
Chrome and Firefox works perfectly, but my sliders in IE not.

CSS

    .bx-wrapper {
        position: relative;
        margin: 0 auto 60px;
        padding: 0;
        *zoom: 1;
    }

    .bx-wrapper img {
        max-width: 100%;
        display: block;
    }
Kara
  • 6,115
  • 16
  • 50
  • 57
user3119293
  • 33
  • 1
  • 2
  • 1
    What does "doesn't work" mean? – deceze Dec 19 '13 at 13:34
  • 1
    Hacks shouldn't be used for cross browser compatibility. Use conditionnal CSS. See: http://www.quirksmode.org/css/condcom.html – Thibault Dec 19 '13 at 13:36
  • 1
    The `*` Hack for IE apply only to IE <= 7 http://browserhacks.com/ – DaniP Dec 19 '13 at 13:37
  • have a google for ie conditional stylesheets – Pete Dec 19 '13 at 13:38
  • 1
    You shouldn't need hacks for IE9. bxSlider works fine in IE9. – ralph.m Dec 19 '13 at 13:38
  • The `zoom: 1` fix is a hack to apply `hasLayout` to elements in old versions of IE (8 and below IIRC). You shouldn't need it for ie9. Also, the "star hack" is not needed for `zoom`, it's most commonly used to simulate `display: inline-block` which isn't supported in old IE (e.g. `display: block; display: *inline;`) – Ennui Dec 19 '13 at 13:41
  • What is the `zoom` meant to do? In what way does it fail? Not enough info in the question. – Spudley Dec 19 '13 at 13:45
  • Also, what browser mode is IE9 showing the page in? (if you're in compat mode or quirks mode, then you need to fix that before asking why individual styles aren't working) – Spudley Dec 19 '13 at 13:45

2 Answers2

4

The "Star hack" as you call it for the property value to IE7 and below if i'm not mistaken. Just use the normal zoom without the asterix(*).

However i would suggest you to not use the zoom property as it also affects the viewport.
Also the zoom was mostly used to fix some bugs on older IE browsers: What bug does zoom:1; fix in CSS?

Instead you want to use transform: scale(x); . This will not affect the viewport but only the element.

Tested on IE 11

Community
  • 1
  • 1
nkmol
  • 8,025
  • 3
  • 30
  • 51
1

Actually you shouldn't use zoom at all. It's better to use the Transform class.

div {
  -webkit-transform: value;
  -moz-transform:    value;
  -ms-transform:     value;
  -o-transform:      value;
  transform:         value;
}
deW1
  • 5,562
  • 10
  • 38
  • 54
  • 1
    @dan you are right that you should use `transform` instead of `zoom`. You might want to explain why :) `zoom` is something different as `transform` but you should not even use `zoom` in the first place. whith `transform: scale(x);` you can get the same effect. So don't mind the others ^^ – nkmol Dec 19 '13 at 14:04
  • Does "transform" trigger "hasLayout" in IE5-7, though? – Stokely Feb 08 '21 at 16:00