After content

Sergio wrote:

Histoire de faire un lexique, et d'avoir un " :" après le mot, j'ai fait :

dt:after {content " :"
}

Bug :
- Opera l'affiche correctement
- Firefox 1.0 affiche  : après l'item (sans interpréter l'entité)
- IE, le problème est réglé : il n'affiche rien.

Comment mettre un vrai espace insécable dans le cas de Firefox ? (IE, on
l'oublie)

Non testé, enfin pas comme cela :

dt:after {content "a0:"}

Sinon pour que ça marche partout il te reste la possibilité de mettre
les deux points dans une image de fond.

--
Raphaël
http://www.r-wils.com
« Don't mean a thing if you ain't got that swing ! »

Le 11/12/2004 10:10, Raphaël Wils a écrit :

dt:after {content " :"
}

Sinon pour que ça marche partout il te reste la possibilité de mettre
les deux points dans une image de fond.

Beurk !

Le plus simple ne serait-il pas de mettre l'espace insécable directement
dans le fichier CSS ? Évidemment, pour le faire il faut avoir un éditeur
qui ne remplace pas ce caractère pas une simple espace. Et l'idéal est
d'avoir un éditeur qui montre clairement que c'est une insécable.

Note que c'est censément possible aussi bien en UTF-8 que dans n'importe
laquelle des normes ISO-8859. Tiens, au fait, quel est l'encodage
supposé d'un fichier CSS externe ? c'est UTF-8, ou bien c'est le même
que celui de la page appelante ?

Olivier Miakinen a écrit :

Tiens, au fait, quel est l'encodage
supposé d'un fichier CSS externe ? c'est UTF-8, ou bien c'est le même
que celui de la page appelante ?

Ce n'est pas censé être indiqué dans les entêtes HTTP ?

Raphaël Wils avait prétendu :

dt:after {content " :"

Comment mettre un vrai espace insécable dans le cas de Firefox ? (IE, on
l'oublie)

Non testé, enfin pas comme cela :

dt:after {content "a0:"}

Ça marche !

Sinon pour que ça marche partout il te reste la possibilité de mettre les
deux points dans une image de fond.

C'est de l'humour ? Et comment tu ferais ?
Comment tu ferais pour que ça colle :
<dl>
<dt>HTML</dt>
<dd>HyperText Langage Markup.
</dd>
</dl>

<dl>
<dt>Anticonstitutionnellement</dt>
<dd>Un mot un peu long.
</dd>
</dl>

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org

Xavier Robin wrote:

Ce n'est pas censé être indiqué dans les entêtes HTTP ?

C'est soit celui donné par HTTP, soit celui indiqué dans la CSS. Pour
ça, il faut que la première ligne de la CSS soit: @charset "utf-8".
C'est plutôt bien supporté, d'ailleurs. Surtout par Gecko. ;-) Sinon, il
existe aussi un attribut charset pour <link>.

Voir: http://www.w3.org/TR/CSS21/syndata.html#x56

--
Fabrice Bonny

http://openweb.eu.org/
http://opquast.org/

Le 11/12/2004 14:38, Fabrice Bonny répondait à Xavier Robin :

Ce n'est pas censé être indiqué dans les entêtes HTTP ?

C'est soit celui donné par HTTP, soit celui indiqué dans la CSS. Pour
ça, il faut que la première ligne de la CSS soit: @charset "utf-8".
C'est plutôt bien supporté, d'ailleurs. Surtout par Gecko. ;-) Sinon, il
existe aussi un attribut charset pour <link>.

Voir: http://www.w3.org/TR/CSS21/syndata.html#x56

Merci à tous les deux !

Sergio a ecrit :

Comment tu ferais pour que ça colle :

par exemple :
(quand on peut faire compliqué par une css assez simple ...)

<style type="text/css">
dt { width: 20em; background: url('2p.gif') top right no-repeat;
text-align: right; padding-right: 20px;}
dd { margin-left:20em;}
</style>

<dl>
<dt>HTML</dt>
<dd>HyperText Langage Markup.
</dd>
</dl>

<dl>
<dt>Anticonstitutionnellement</dt>
<dd>Un mot un peu long.
</dd>
</dl>

--
*******************************************************
Stéphane MORIAUX et son vieux Mac
Aide Pages Perso (images & couleurs, formulaire, CHP)
http://perso.wanadoo.fr/stephane.moriaux/internet/
*******************************************************

ASM a émis l'idée suivante :

par exemple :
(quand on peut faire compliqué par une css assez simple ...)

<style type="text/css">
dt { width: 20em; background: url('2p.gif') top right no-repeat;
text-align: right; padding-right: 20px;}
dd { margin-left:20em;}
</style>

Pas beau ! Je veux le mot aligné à gauche, avec le " :" derrière.
Bon, ça ça marche (sauf pour IE qui ignore le after) :
-----------------
dt {
font-style: italic ;
}

dt:after {content: "a0:" ;
}

dd {
font-style: normal ;
margin-left: 55px ;
}

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org

Sergio a ecrit :

ASM a émis l'idée suivante :

> (quand on peut faire compliqué par une css assez simple ...)

Pas beau !

L'idée était de répondre à ton interrogation
pas de faire une oeuvre d'art ;-))

Je veux le mot aligné à gauche, avec le " :" derrière.

On s'en était douté ;-))

Bon, ça ça marche (sauf pour IE qui ignore le after) :

Moarche pô non plus avec mon IE5.1 (vieux Mac)

Y a plus qu'à le taper en dur donc

dt {
font-style: italic ;
}

dt:after {content: "a0:" ;
}

dd {
font-style: normal ;
margin-left: 55px ;
}

--
*******************************************************
Stéphane MORIAUX et son vieux Mac
Aide Pages Perso (images & couleurs, formulaire, CHP)
http://perso.wanadoo.fr/stephane.moriaux/internet/
*******************************************************