CSS \ 9 dans la propriété width

209

Qu'est-ce que cela veut dire? Je suppose que c'est un piratage de navigateur, mais je n'ai pas pu trouver exactement ce qu'il fait.

width: 500px\9;

Quelle est la signification de \9?

css width css-hack

— bien en fait
source

dans un fichier css .. définition de la largeur d'un élément.

— fait,

pas de doublon exact, mais cette question vous répond: stackoverflow.com/questions/701732/size-in-css-with-slash

— Raptor

ne semble pas être valide dans aucune version CSS, pour autant que je puisse voir ...

— Marc B

Je ne pense pas que cette question se réfère à la même chose.

— bien en fait

6

@Shivan Raptor: Non, ce n'est pas le cas. C'est une question totalement différente.

— BoltClock

290

\9 est un "hack CSS" spécifique à Internet Explorer 7, 8 et 9.

Cela signifie simplement que la seule ligne spécifique de CSS se terminant par un \9;à la place de ;n'est valide que dans IE 7, 8 et 9.

Dans votre exemple,

width: 500px\9;signifie qu'une largeur de 500 pixels (même résultat que width: 500px;) ne sera appliquée que lors de l'utilisation d'IE 7, 8 et 9.

Tous les autres navigateurs ignoreront width: 500px\9;complètement et ne s'appliqueront donc pas du tout width: 500px;à l'élément.

Si votre CSS ressemblait à ceci ...

#myElement {
    width: 300px;
    width: 500px\9;
}

Le résultat serait de #myElement500 pixels de large dans IE 7, 8 et 9, tandis que dans tous les autres navigateurs, il #myElementaurait une largeur de 300 pixels.

Plus d'informations

ÉDITER:

Cette réponse a été écrite en 2011. Il convient maintenant de noter que ce hack fonctionne également dans IE 10.

— Sparky
source

1

@ jdavid.net, si ça ne casse pas votre CSS, absolument rien, AFAIK.

— Sparky

10

\0au lieu de \9l'appliquera également à IE10

— abc123

21

@ abc123 permet d'espérer qu'ils n'obtiendront jamais IE à la version 16.

— Hoffmann

4

D'après mon expérience, je demandais \9également à IE 10 avec une widthpropriété, au moins en mode d'émulation d'IE. Le mode d'émulation est buggé dans le meilleur des cas, c'est peut-être pourquoi.

— davidjb

1

@davidjb, c'est parce que ce n'est pas vraiment un émulateur. Il a été conçu pour remplacer le code plus ancien.

— Sparky

13

C'est un hack CSS pour IE9 et versions inférieures

écrivez comme ceci:

width: 500px\9;

Lisez cet article http://dimox.net/personal-css-hacks-for-ie6-ie7-ie8/

— sandeep
source

4

Merci pour le lien, mais l'article n'explique pas ce qu'il fait.

— bien en fait

1

Nous utilisons hack pour IE pour deux choses. 1) il existe des propriétés qui ne sont pas prises en charge par IE comme display: inline-block & 2) Chaque navigateur affiche différemment certaines propriétés HTML et css. consultez cet article blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block

— sandeep

Vérifiez le lien également coding.smashingmagazine.com/2010/06/07/…

— sandeep

IE prend en charge display: inline-block ;, mauvais exemple.

— reisio

Cependant, cela ne semble pas être un hack particulièrement utile pour la propriété 'width'. Du moins pas en dehors du mode bizarreries.

— reisio

2

Dans IE9 pour définir la propriété width, vous ajoutez simplement ce hack.

par exemple

.align {
    float:left;
    margin:5px;
    background-color:blue;
    width:65px;
    width:\9 !important;
}

— Asad Shah
source

2

Hack CSS pour IE9

/* Hack CSS IE9 */
.csshackie9 {color:#f00\9\0\;}

— gordi
source

7

vous devriez publier plus d'informations sur ce qu'est ce hack au lieu de créer un lien vers l'extérieur - si ce blog a disparu, la valeur de votre réponse diminuerait. De plus, tout le monde ne parle pas russe.

— Marcin Orlowski

1

Il serait préférable de fournir des informations essentielles en anglais, car le lien que vous avez publié est vers le blog russe.

— Artemix

OP, tu devrais te dénoncer et aller t'asseoir sur la marche coquine.

— slugmandrew