[Résolu] Commentaire conditionnel IE qui prend pas ?

Bonjour

Aurais-je oublié une petite chose dans ce code tout sobre ?

<style type="text/css">
* {margin: 0; padding: 0; border: 0; font-family: sans-serif; font-size: 1em; font-weight: normal; font-style: normal; text-decoration: none; }
div {
border: 10px solid;
padding: 10px;
width: 100px;
}
<!--[if IE]>
div { width: 140px; }
<![endif]-->
</style>
<div>bla bla</div>

La source ici (lien trouvé dans la faq Alsacreation)

Merci de votre aide. J'ai besoin de me familiariser avec les commentaires conditionnels car en fait, dans ma feuille css, c'est pour substituer une image sans couche alpha pour IE en place d'un png. J'ai en effet pas trouvé de code valable pour hacker le non support du png 32 bits pour IE...
Modifié par globy (21 Nov 2005 - 09:12)

Salut,

le problème vient je pense du fait que tu utilises une syntaxe de commentaire pour le html là où ne serait attendu qu'un commentaire css soit /*commentaire*/

essayes donc (dans le cadre strict que toi même tu indiques )

<style type="text/css">

</style>

<!--[if IE]>
<style type="text/css">

</style>
<! [ endif ] -->

Modifié par clb56 (20 Nov 2005 - 17:55)

Ok je vois. Et donc il est possible d'en faire de même pour une css liée tout comme importée comme il est signalé dans le second commentaire :

a écrit :
<!--[if IE]><style>@import url(iestuff.css)</style><![end if]-->
<!--[if IE]><link rel='stylesheet' href="i_am_a_s**t_browser.css"
type="text/css" /><![endif]-->

Source

J'imaginais qu'on pouvait faire ça plus ponctuellement sans gérer forcement deux feuilles différentes.

Merci.
Modifié par globy (20 Nov 2005 - 23:17)

C'est exact, j'ai eu le même problème aujourd'hui dans la même situation.

Les <!-- --> sont une très mauvaise idée dans une feuille de style, ça bug! même au sein d'une page, les commentaires CSS sont différents.

La solution est donc celle indiquée par clb56, et si en théorie il est un peut bizarre d'avoir deux déclarations <style>, comme la 2e est ici interprétée comme un commentaire par tous les navigateurs il n'y a pas de problème de validation.

Sinon il reste possible d'utiliser un <link>.

Il faut bien comprendre comment ces Conditional Comments fonctionnent: ce sont avant tout des commentaires, qui sont interprétés par IE parce qu'il y trouve [if IE]. Pour les autres navigateurs, c'est circulez, il n'y a rien à voir.
Modifié par matgorb (21 Nov 2005 - 09:33)

Bonjour,

matgorb a écrit :
si en théorie il est un peut bizarre d'avoir deux déclarations <style>, comme la 2e est ici interprétée comme un commentaire par tous les navigateurs il n'y a pas de problème de validation.

Il est tout à fait normal d'avoir plusieurs éléments styles successifs dans un document (X)HTML. Par exemple, pour une gestion des styles par média quand on ne souhaite pas utiliser la règle @media pour des raisons de compatibilité
Modifié par Laurent Denis (21 Nov 2005 - 06:51)

@Laurent : j'ai beau « retourner le ouaib » j'ai du mal à trouver un exemple complet et francophone avec ces commentaires conditionnels. Que des bouts de code et pas toujours explicites pour les débutants (avec l'idée d'externaliser les différentes feuilles).
Si tu as ça sous la main, un énorme merci
Sinon je viens de trouver ton post là où, si je te suis bien, grâce à un commentaire conditionnel tu ferais manger à IE du gif en place d'un png 32 bits. Tu devrais peut-être insister plus sur la possibilité externaliser ça dans une feuille juste pour IE ou laisser en dur dans le code avec un style conditionnel si le code est aussi léger que dans ce cas.
Voilà, je fais juste ce lien croisé si ça peut aider quelqu'un à comprendre la chose

Merci à tous. [Résolu]

Laurent Denis a écrit :
Bonjour,



Il est tout à fait normal d'avoir plusieurs éléments styles successifs dans un document (X)HTML. Par exemple, pour une gestion des styles par média quand on ne souhaite pas utiliser la règle @media pour des raisons de compatibilité

Autant pour moi, j'ai tellement l'habitude d'utiliser des link pour tout ce qui n'est pas screen style sheet que j'avais oublié que l'on pouvait réutiliser un bloc <style> pour un autre media.

Dans ce cas précis, globy n'utilisant pas de « media= », cela reste étrange dans l'absolue d'avoir deux déclarations séparées pour le même media.

<style type="text/css">
un peu de style 1
</style>

<style type="text/css">
un peu de style 2
</style>

au lieu de

<style type="text/css">
un peu de style 1
un peu de style 2
</style>

Pour globy:
Les commentaires conditionels sont de 2 formes:
—caché
dit "downlevel-hidden" <!--[if expression]> HTML <![endif]-->

—et révélé
dit "downlevel-revealed" <![if expression]> HTML <![endif]>

Il faut oublié les seconds qui sont une totale aberration microsoftienne, mais les premiers se présentant comme des commentaires HTML (d'où le nom) ils seront considérés comme tels par tous les agents utilisateurs, sauf IE 5 et plus qui peuvent y détecter le fameux code conditionnel.

En tant que commentaires HTML, ils ne peuvent être utilisés que pour conditionner des tags HTML, en effet dans ton exemple tu te trouve dans une feuille de style, qui même si interne est régie par les « lois » CSS et non HTML (type="text/css"… ), où les commentaires ne sont pas <!-- bla bla --> mais /* bla bla */.

<html>
<head>
Ici je suis de l' HTML, je peut donc avoir de l'HTML (d'entête) et des commentaires HTML.
<style type="text/css">
Ici je suis du CSS, je ne peut donc pas avoir d'HTML, et par extension de commentaires HTML.
</style>
Ici je suis de nouveau de l' HTML, je peut donc avoir de l'HTML (d'entête) et des commentaires HTML.
</head>
<body>
Ici je suis encore de l' HTML, je peut donc avoir de l'HTML (de corps) et des commentaires HTML.
</body>
</html>

Les commentaires conditionnels ne peuvent donc s'employer que sur:

<!--[if expression]><tag></tag><![endif]-->
<!--[if expression]><tag /><![endif]-->
<!--[if expression]>du simple texte dans le corps de la page<![endif]-->

et leurs combinaisons.

matgorb a écrit :

Dans ce cas précis, globy n'utilisant pas de « media= », cela reste étrange dans l'absolue d'avoir deux déclarations séparées pour le même media.

C'est ce qui me perturbait effectivement. Et c'est pourquoi j'avais cru simplifier le code en rassemblant tout dans la même déclaration de style. D'où l'erreur.
Si c'est pas un thread hyper complet et didactique tout ça
En fait tout vient, je pense, qu'un manque dans la dénomination. Je verrais mieux : "les commentaires html conditionnels au service des css"

Merci encore.