Css invalide ("erreur lors de l'analyse grammaticale...)

Le 3/6/09 4:37 PM, paul a écrit :

Bonjour,

Savez-vous pourquoi cette syntaxe...

Non, c'est du charabia pour moi.
Mais ...

.entry-home .featured_left dt img, .entry-home .featured_right dt img
{
max-width: 100px;
max-height: 100px;
/* For Internet Explorer */
_width: expression((this.offsetWidth>=this.offsetHeight) ?
Math.min(parseInt(this.offsetWidth), 100 ) : true);
_height: expression((this.offsetHeight>this.offsetWidth) ?
Math.min(parseInt(this.offsetHeight), 100 ) : true);
}

contrarie le valideur Css, qui m'indique pour chacune des deux
propriétés...

"Erreur lors de l'analyse grammaticale. expression
((this.offsetWidth>=this.offsetHeight) ? Math.min(parseInt
(this.offsetWidth), 100 ) : true)"

Deux commentaires, cependant, pour éclairer mon propos...

en parlant de commentaires ...

il faut utiliser les commentaires conditionnels pour causer aux IE
<http://msdn.microsoft.com/en-us/library/ms537512.aspx>

ainsi :
- M$ est content puises que c'est ce qu'il préconise
- W3C est content aussi puisqu'il n'analisera pas le code commenté

Lors donc les underscores ne seront plus nécessaires
.... ça fait déjà ça de moins à se soucier

<style type="text/css">
.entry-home .featured_left dt img,
.entry-home .featured_right dt img
{
width: 100px;
}
</style>
<!--[if IE]>
<style>
.entry-home .featured_left dt img,
.entry-home .featured_right dt img
{
width: expression((this.offsetWidth>=this.offsetHeight) ?
Math.min(parseInt(this.offsetWidth), 100 ) : true);
height: expression((this.offsetHeight>this.offsetWidth) ?
Math.min(parseInt(this.offsetHeight), 100 ) : true);
}
</style>
<![endif]-->
</head>

- Je veux redimensionner les images uniquement lorsqu'elles sortent du

Je ne vois pas là où ça "sort" du flux ... mébon.

"flux" et apparaîssent dans une petite colonne. A tout moment, elles
peuvent reprendre leur place dans le "flux" normal et afficher leurs
dimensions originales de 150 x 150 pixels. Je me sers donc bien de Css
uniquement pour gérer la présentation.

- J'ai trouvé cette astuce pour Internet Explorer, qui semblent mal
gérer ce redimensionnement.

Je ne comprends pas que le truc-bazar n'aie pas une largeur et une
hauteur (qui soient élastiques, en % / au conteneur ou même fixes) mais
seulement des maximales.

L'underscore devant les propriétés servent
à préciser qu'elles ne s'appliquent que pour ce navigateur.

Merci pour votre aide,

Malheureusement je ne connais rien à ce truc d'expression à la M$.
il semble que l'idée est de donner comme dimension 100 (et on ne sait
pas quoi ... cm, px, em, % ?) ou moins.
Cependant et à mon idée offsetWidth c'est la largeur "apparente" de
l'élément y compris sa bordure et non pas sa "vraie" largeur.

J'aurais tenté :
width: expression((this.offsetWidth>=this.offsetHeight) ?
Math.min(parseInt(this.width), 100 ) : true);
bien qu'on n'en ait pas besoin (cf + bas)

Cordialement,

Au fait, le truc-bazar est une image à ce qu'il parait.
Comment se fait-ce qu'il faille lui donner une hauteur ?
Normalement quand on détermine une largeur pour une image, sa hauteur
s'accorde tte seule proportionnellement, il devrait normalement suffire
de ne se préoccuper que de cette largeur (idéalement en %).
Yaka faire des images carrées dès le départ
(et tant qu'à faire en 100px de côté)
Ha?! oui j'avais zappé ... elles sont en 150/150px.
Ça gaze donc de ce côté.

à noter :
max-height n'influe pas si l'image est plus large que haute
(et sans doute lycèe de versailles)


Résultat des courses :
=====================
<style type="text/css">
.entry-home .featured_left dt img,
.entry-home .featured_right dt img
{
width: 100px;
}
</style>

devrait satisfaire tout l'monde sans hack ni rien
l'image sera de 100px de côté dès qu'elle est dant un DT lui-même dans
un truc de class featured... lui-même dans ...
et de taille "normale" si elle est ailleurs
(sauf s'il y a un autre tremblement céhesséssique pour cet ailleurs)


Consulter la MSDN de M$ assidument, comme, par exemple :
<http://msdn.microsoft.com/en-us/library/ms531213(VS.85).aspx>
mais seulement après avoir employé cekivabien.
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

--
sm

Le 06/03/2009 16:37, paul a écrit :

Bonjour,

Savez-vous pourquoi cette syntaxe...

.entry-home .featured_left dt img, .entry-home .featured_right dt img
{
max-width: 100px;
max-height: 100px;
/* For Internet Explorer */
_width: expression((this.offsetWidth>=this.offsetHeight) ?
Math.min(parseInt(this.offsetWidth), 100 ) : true);
_height: expression((this.offsetHeight>this.offsetWidth) ?
Math.min(parseInt(this.offsetHeight), 100 ) : true);
}

contrarie le valideur Css, qui m'indique pour chacune des deux
propriétés...

"Erreur lors de l'analyse grammaticale. expression
((this.offsetWidth>=this.offsetHeight) ? Math.min(parseInt
(this.offsetWidth), 100 ) : true)"

Je suppose que tu utilises un validateur CSS conforme à la norme, pas un
validateur conforme aux spécificités de Microsoft. Ou bien ?

[...]

- J'ai trouvé cette astuce pour Internet Explorer, qui semblent mal
gérer ce redimensionnement. L'underscore devant les propriétés servent
à préciser qu'elles ne s'appliquent que pour ce navigateur.

Ça s'appelle un hack. Libre à toi d'utiliser des hacks pour Internet
Explorer, mais dans ce cas tu ne peux pas t'attendre à ce que tes
définitions reçoivent l'aval d'un validateur conforme à la norme. Rien
que les noms _width et _height devraient suffire à le faire râler.


Cordialement,
--
Olivier Miakinen

Bonsoir,

Merci Sam ! Merci Olivier !

Si je pouvais mettre "résolu", je l'inscrirai.

Je vais me rabattre sur une solution plus simple, assurément ! :)

Cordialement,

Paul