Et là le style ne marche plus même si j'essaye de faire ce qui suit dans
le CSS :
div.titelg img{font-size:120%; /* fond des titres des menus */
background-color:#00c;}
Donc img gênerait l'application du style. Est-ce normal ?
Si oui comment procéder alors ?
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire
Veuillez sélectionner un problème
Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Patrick 'Zener' Brunet
Bonjour.
"Bernd" a écrit dans le message de news: 1iq3iol.1ggqh2w19g1jbqN%
[...] Et là le style ne marche plus même si j'essaye de faire ce qui suit dans le CSS : div.titelg img {font-size:120%; /* fond des titres des menus */ background-color:#00c;}
Taille de texte + couleur de fond appliquées à une image ?
Sur le alt text s'il n'était pas vide et en l'absence du gif alors...
-- Cordialement. -- * Patrick BRUNET www.ipzb.fr * E-mail: lien sur http://zener131.eu/ContactMe
Bonjour.
"Bernd" <romer@bernd.invalid> a écrit dans le message de news:
1iq3iol.1ggqh2w19g1jbqN%romer@bernd.invalid...
[...]
Et là le style ne marche plus même si j'essaye de faire
ce qui suit dans le CSS :
div.titelg img
{font-size:120%; /* fond des titres des menus */
background-color:#00c;}
Taille de texte + couleur de fond appliquées à une image ?
Sur le alt text s'il n'était pas vide et en l'absence du gif alors...
--
Cordialement.
--
* Patrick BRUNET www.ipzb.fr
* E-mail: lien sur http://zener131.eu/ContactMe
"Bernd" a écrit dans le message de news: 1iq3iol.1ggqh2w19g1jbqN%
[...] Et là le style ne marche plus même si j'essaye de faire ce qui suit dans le CSS : div.titelg img {font-size:120%; /* fond des titres des menus */ background-color:#00c;}
Taille de texte + couleur de fond appliquées à une image ?
Sur le alt text s'il n'était pas vide et en l'absence du gif alors...
-- Cordialement. -- * Patrick BRUNET www.ipzb.fr * E-mail: lien sur http://zener131.eu/ContactMe
romer
Patrick 'Zener' Brunet wrote:
"Bernd" a écrit dans le message de news: 1iq3iol.1ggqh2w19g1jbqN% > [...] > Et là le style ne marche plus même si j'essaye de faire > ce qui suit dans le CSS : > div.titelg img > {font-size:120%; /* fond des titres des menus */ > background-color:#00c;} >
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je place l'image avant, elle ne se positionne pas au même endroit... -- A+
Romer
Patrick 'Zener' Brunet <use.link.in.signature@ddress.invalid> wrote:
"Bernd" <romer@bernd.invalid> a écrit dans le message de news:
1iq3iol.1ggqh2w19g1jbqN%romer@bernd.invalid...
> [...]
> Et là le style ne marche plus même si j'essaye de faire
> ce qui suit dans le CSS :
> div.titelg img
> {font-size:120%; /* fond des titres des menus */
> background-color:#00c;}
>
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je
place l'image avant, elle ne se positionne pas au même endroit...
--
A+
"Bernd" a écrit dans le message de news: 1iq3iol.1ggqh2w19g1jbqN% > [...] > Et là le style ne marche plus même si j'essaye de faire > ce qui suit dans le CSS : > div.titelg img > {font-size:120%; /* fond des titres des menus */ > background-color:#00c;} >
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je place l'image avant, elle ne se positionne pas au même endroit... -- A+
Romer
Olivier Miakinen
Le 08/11/2008 16:57, Bernd a écrit :
Voilà un pb. apparemment simple mais que je ne résoud pas : Titre de menu html : <div class="titelg gras">Formations</div>
Voilà son style CSS : div.titelg{font-size:120%; /* fond des titres des menus */ background-color:#00c;}
Ça marche.
Ok.
Maintenant voilà le titre suivant avec une flèche devant (utile) :
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
même si j'essaye de faire ce qui suit dans le CSS : div.titelg img{font-size:120%; /* fond des titres des menus */ background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans* l'image, mais *après* l'image.
Donc img gênerait l'application du style. Est-ce normal ?
Non, ce n'est pas normal.
Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour constater le phénomène (ce qui devrait d'ailleurs être LA première chose à faire) ?
Le 08/11/2008 16:57, Bernd a écrit :
Voilà un pb. apparemment simple mais que je ne résoud pas :
Titre de menu html :
<div class="titelg gras">Formations</div>
Voilà son style CSS :
div.titelg{font-size:120%; /* fond des titres des menus */
background-color:#00c;}
Ça marche.
Ok.
Maintenant voilà le titre suivant avec une flèche devant (utile) :
Je viens d'essayer : chez moi ça marche encore, aussi bien avec
SeaMonkey qu'avec Internet Explorer.
même si j'essaye de faire ce qui suit dans le CSS :
div.titelg img{font-size:120%; /* fond des titres des menus */
background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans*
l'image, mais *après* l'image.
Donc img gênerait l'application du style. Est-ce normal ?
Non, ce n'est pas normal.
Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour
constater le phénomène (ce qui devrait d'ailleurs être LA première chose
à faire) ?
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
même si j'essaye de faire ce qui suit dans le CSS : div.titelg img{font-size:120%; /* fond des titres des menus */ background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans* l'image, mais *après* l'image.
Donc img gênerait l'application du style. Est-ce normal ?
Non, ce n'est pas normal.
Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour constater le phénomène (ce qui devrait d'ailleurs être LA première chose à faire) ?
romer
Olivier Miakinen <om+ wrote:
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne fonctionne pas.
> même si j'essaye de faire ce qui suit dans le CSS : > div.titelg img{font-size:120%; /* fond des titres des menus */ > background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans* l'image, mais *après* l'image.
> Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour constater le phénomène (ce qui devrait d'ailleurs être LA première chose à faire) ?
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait plus simple et ça marche. Je n'ai pas vérifié sur IE mais comme je me retrouve avec ...a:hover..., je suis quasiment sûr que ça va fonctionner.
Merci de vos interventions. -- A+
Romer
Olivier Miakinen <om+news@miakinen.net> wrote:
Je viens d'essayer : chez moi ça marche encore, aussi bien avec
SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne
fonctionne pas.
> même si j'essaye de faire ce qui suit dans le CSS :
> div.titelg img{font-size:120%; /* fond des titres des menus */
> background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans*
l'image, mais *après* l'image.
> Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour
constater le phénomène (ce qui devrait d'ailleurs être LA première chose
à faire) ?
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait
plus simple et ça marche. Je n'ai pas vérifié sur IE mais comme je me
retrouve avec ...a:hover..., je suis quasiment sûr que ça va
fonctionner.
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne fonctionne pas.
> même si j'essaye de faire ce qui suit dans le CSS : > div.titelg img{font-size:120%; /* fond des titres des menus */ > background-color:#00c;}
Non, là ça n'a aucune chance de marcher : le texte n'est pas *dans* l'image, mais *après* l'image.
> Si oui comment procéder alors ?
Chercher un autre bug que celui que tu crois ? Nous donner une URL pour constater le phénomène (ce qui devrait d'ailleurs être LA première chose à faire) ?
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait plus simple et ça marche. Je n'ai pas vérifié sur IE mais comme je me retrouve avec ...a:hover..., je suis quasiment sûr que ça va fonctionner.
Merci de vos interventions. -- A+
Romer
Olivier Miakinen
Le 08/11/2008 23:07, Bernd a écrit :
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne fonctionne pas.
Je viens de vérifier : c'est IE7 que j'ai sur la machine où je viens de tester. D'expérience, là où j'ai eu des problèmes avec IE, et à l'époque il n'existait que le 6, c'était avec les classes multiples (comme dans class="titelg gras") : parfois ça marchait et parfois ça ne marchait pas, de façon incompréhensible.
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait plus simple et ça marche.
Ok.
Le 08/11/2008 23:07, Bernd a écrit :
Je viens d'essayer : chez moi ça marche encore, aussi bien avec
SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne
fonctionne pas.
Je viens de vérifier : c'est IE7 que j'ai sur la machine où je viens de
tester. D'expérience, là où j'ai eu des problèmes avec IE, et à l'époque
il n'existait que le 6, c'était avec les classes multiples (comme dans
class="titelg gras") : parfois ça marchait et parfois ça ne marchait
pas, de façon incompréhensible.
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait
plus simple et ça marche.
Je viens d'essayer : chez moi ça marche encore, aussi bien avec SeaMonkey qu'avec Internet Explorer.
C'est là que je ne comprends plus évidemment - sur 5 PC avec IE6, ça ne fonctionne pas.
Je viens de vérifier : c'est IE7 que j'ai sur la machine où je viens de tester. D'expérience, là où j'ai eu des problèmes avec IE, et à l'époque il n'existait que le 6, c'était avec les classes multiples (comme dans class="titelg gras") : parfois ça marchait et parfois ça ne marchait pas, de façon incompréhensible.
Finalement et comme je suis un peu charette, j'ai tout refait et ai fait plus simple et ça marche.
Ok.
SAM
Le 11/8/08 8:33 PM, Bernd a écrit :
Patrick 'Zener' Brunet wrote:
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je place l'image avant, elle ne se positionne pas au même endroit...
au même endroit que quoi ?
Tu n'as qu'à la mettre en background et mettre un padding-left au texte pour laisser voir l'image
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Néanmoins, il n'y a aucune raison que : div.titelg { font-size: 120%; background: #00c; color: #fff } div.titelg img { vertical-align: middle; margin-right: 8px } ne fonctionne pas avec : <div class="titelg"><img src="flch.gif" alt="">truc-muche</div> IE ou pas IE
testé ! <http://cjoint.com/?lixyYt2i6S> (où l'on voit que IE n'est pas très fortiche avec les images)
à mettre en bouton de barre d'outils persos du navigateur : <http://www.yoyodesign.org/doc/w3c/css2/indexlist.html> et le truc de background, ici : <http://www.yoyodesign.org/doc/w3c/css2/colors.html#background-properties>
-- sm
Le 11/8/08 8:33 PM, Bernd a écrit :
Patrick 'Zener' Brunet <use.link.in.signature@ddress.invalid> wrote:
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je
place l'image avant, elle ne se positionne pas au même endroit...
au même endroit que quoi ?
Tu n'as qu'à la mettre en background
et mettre un padding-left au texte pour laisser voir l'image
div.titelg {
background: url(fleche.gif) no-repeat left center #00c;
font-size: 120%;
padding-left: 60px;
}
Néanmoins, il n'y a aucune raison que :
div.titelg { font-size: 120%; background: #00c; color: #fff }
div.titelg img { vertical-align: middle; margin-right: 8px }
ne fonctionne pas avec :
<div class="titelg"><img src="flch.gif" alt="">truc-muche</div>
IE ou pas IE
testé !
<http://cjoint.com/?lixyYt2i6S>
(où l'on voit que IE n'est pas très fortiche avec les images)
à mettre en bouton de barre d'outils persos du navigateur :
<http://www.yoyodesign.org/doc/w3c/css2/indexlist.html>
et le truc de background, ici :
<http://www.yoyodesign.org/doc/w3c/css2/colors.html#background-properties>
Taille de texte + couleur de fond appliquées à une image ?
Je vois bien l'incongruïté de la chose mais comment faire alors ? Si je place l'image avant, elle ne se positionne pas au même endroit...
au même endroit que quoi ?
Tu n'as qu'à la mettre en background et mettre un padding-left au texte pour laisser voir l'image
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Néanmoins, il n'y a aucune raison que : div.titelg { font-size: 120%; background: #00c; color: #fff } div.titelg img { vertical-align: middle; margin-right: 8px } ne fonctionne pas avec : <div class="titelg"><img src="flch.gif" alt="">truc-muche</div> IE ou pas IE
testé ! <http://cjoint.com/?lixyYt2i6S> (où l'on voit que IE n'est pas très fortiche avec les images)
à mettre en bouton de barre d'outils persos du navigateur : <http://www.yoyodesign.org/doc/w3c/css2/indexlist.html> et le truc de background, ici : <http://www.yoyodesign.org/doc/w3c/css2/colors.html#background-properties>
-- sm
Patrick 'Zener' Brunet
Bonjour.
"SAM" a écrit dans le message de news: 4916130e$0$969$
[...]
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un inline ? Typiquement pour rajouter une iconette (fournie par la CSS) via un background-image à un lien au milieu du texte.
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Merci. -- Cordialement. -- * Patrick BRUNET www.ipzb.fr www.ipzb-pro.com * E-mail: lien sur http://zener131.eu/ContactMe
Bonjour.
"SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> a écrit dans le message
de news: 4916130e$0$969$ba4acef3@news.orange.fr...
[...]
div.titelg {
background: url(fleche.gif) no-repeat left center #00c;
font-size: 120%;
padding-left: 60px;
}
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un
inline ?
Typiquement pour rajouter une iconette (fournie par la CSS) via un
background-image à un lien au milieu du texte.
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Merci.
--
Cordialement.
--
* Patrick BRUNET www.ipzb.fr www.ipzb-pro.com
* E-mail: lien sur http://zener131.eu/ContactMe
"SAM" a écrit dans le message de news: 4916130e$0$969$
[...]
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un inline ? Typiquement pour rajouter une iconette (fournie par la CSS) via un background-image à un lien au milieu du texte.
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Merci. -- Cordialement. -- * Patrick BRUNET www.ipzb.fr www.ipzb-pro.com * E-mail: lien sur http://zener131.eu/ContactMe
SAM
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit :
Bonjour.
Ciao,
"SAM" a écrit dans le message de news: 4916130e$0$969$
[...]
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7 (et bien sûr tous les autres brouteurs graphiques non IE)
Typiquement pour rajouter une iconette (fournie par la CSS) via un background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>) du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option { background: url(plus.gif) no-repeat left center #ccc; font-size: 120%; padding-left: 40px; }
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Merci.
Méderien ;-)
-- sm contact: http://stephane.moriaux.pagesperso-orange.fr/contact
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit :
Bonjour.
Ciao,
"SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> a écrit dans le message
de news: 4916130e$0$969$ba4acef3@news.orange.fr...
[...]
div.titelg {
background: url(fleche.gif) no-repeat left center #00c;
font-size: 120%;
padding-left: 60px;
}
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un
inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7
(et bien sûr tous les autres brouteurs graphiques non IE)
Typiquement pour rajouter une iconette (fournie par la CSS) via un
background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>) du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option {
background: url(plus.gif) no-repeat left center #ccc;
font-size: 120%;
padding-left: 40px;
}
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Merci.
Méderien ;-)
--
sm
contact: http://stephane.moriaux.pagesperso-orange.fr/contact
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit :
Bonjour.
Ciao,
"SAM" a écrit dans le message de news: 4916130e$0$969$
[...]
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
Tiens, tu as un truc 100% fiable pour faire ça avec un container qui soit un inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7 (et bien sûr tous les autres brouteurs graphiques non IE)
Typiquement pour rajouter une iconette (fournie par la CSS) via un background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>) du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option { background: url(plus.gif) no-repeat left center #ccc; font-size: 120%; padding-left: 40px; }
Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Merci.
Méderien ;-)
-- sm contact: http://stephane.moriaux.pagesperso-orange.fr/contact
romer
SAM wrote:
au même endroit que quoi ?
C'est une flèche bitmap placée devant un titre.
Tu n'as qu'à la mettre en background et mettre un padding-left au texte pour laisser voir l'image
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
En effet, ainsi ça fonctionne - je n'avais pas pensé à la possibilité du background avec décalage gauche.
à mettre en bouton de barre d'outils persos du navigateur : <http://www.yoyodesign.org/doc/w3c/css2/indexlist.html> et le truc de background, ici : <http://www.yoyodesign.org/doc/w3 c/css2/colors.html#background-properties>
Tanx -- A+
Romer
SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:
au même endroit que quoi ?
C'est une flèche bitmap placée devant un titre.
Tu n'as qu'à la mettre en background
et mettre un padding-left au texte pour laisser voir l'image
div.titelg {
background: url(fleche.gif) no-repeat left center #00c;
font-size: 120%;
padding-left: 60px;
}
En effet, ainsi ça fonctionne - je n'avais pas pensé à la possibilité du
background avec décalage gauche.
à mettre en bouton de barre d'outils persos du navigateur :
<http://www.yoyodesign.org/doc/w3c/css2/indexlist.html>
et le truc de background, ici :
<http://www.yoyodesign.org/doc/w3 c/css2/colors.html#background-properties>
Tu n'as qu'à la mettre en background et mettre un padding-left au texte pour laisser voir l'image
div.titelg { background: url(fleche.gif) no-repeat left center #00c; font-size: 120%; padding-left: 60px; }
En effet, ainsi ça fonctionne - je n'avais pas pensé à la possibilité du background avec décalage gauche.
à mettre en bouton de barre d'outils persos du navigateur : <http://www.yoyodesign.org/doc/w3c/css2/indexlist.html> et le truc de background, ici : <http://www.yoyodesign.org/doc/w3 c/css2/colors.html#background-properties>
Tanx -- A+
Romer
Patrick 'Zener' Brunet
Bonjour.
"SAM" a écrit dans le message de news: 4916c0b6$0$881$
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit : > "SAM" > a écrit dans le message > de news: 4916130e$0$969$ >> [...] > >> div.titelg { >> background: url(fleche.gif) no-repeat left center #00c; >> font-size: 120%; >> padding-left: 60px; >> } >> > > Tiens, tu as un truc 100% fiable pour faire ça avec > un container qui soit un inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7 (et bien sûr tous les autres brouteurs graphiques non IE)
> Typiquement pour rajouter une iconette (fournie par la CSS) > via un background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>) du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option { background: url(plus.gif) no-repeat left center #ccc; font-size: 120%; padding-left: 40px; }
> Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Alors j'ai fait un bilan (j'utilise ça sur mes sites pour les liens "page suivante/page précédente", et aussi pour les iconettes de lien sortant.
Avec inline et un padding, ça marche bien même sur IE6, par contre sur IE5.5, le padding est ignoré et l'iconette se trouve sous le texte. En fait sur IE5.5, inline semble interdire tout ce qui confère une extra-longueur: width comme padding.
C'est mieux avec inline-block que IE5.5 reconnaît bien, mais qui évidemment pose d'autres problèmes...
J'ai souvenir qu'au début j'avais même tenté de réserver la place avec un GIF transparent, mais c'était aussi lourd que dégueu, alors comme c'est mineur, j'ai laissé tomber pour IE5.5.
-- Cordialement. -- * Patrick BRUNET www.ipzb.fr www.ipzb-pro.com * E-mail: lien sur http://zener131.eu/ContactMe
Bonjour.
"SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> a écrit dans le message
de news: 4916c0b6$0$881$ba4acef3@news.orange.fr...
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit :
> "SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid>
> a écrit dans le message
> de news: 4916130e$0$969$ba4acef3@news.orange.fr...
>> [...]
>
>> div.titelg {
>> background: url(fleche.gif) no-repeat left center #00c;
>> font-size: 120%;
>> padding-left: 60px;
>> }
>>
>
> Tiens, tu as un truc 100% fiable pour faire ça avec
> un container qui soit un inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7
(et bien sûr tous les autres brouteurs graphiques non IE)
> Typiquement pour rajouter une iconette (fournie par la CSS)
> via un background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>)
du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option {
background: url(plus.gif) no-repeat left center #ccc;
font-size: 120%;
padding-left: 40px;
}
> Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Alors j'ai fait un bilan (j'utilise ça sur mes sites pour les liens
"page suivante/page précédente", et aussi pour les iconettes
de lien sortant.
Avec inline et un padding, ça marche bien même sur IE6, par contre sur
IE5.5, le padding est ignoré et l'iconette se trouve sous le texte.
En fait sur IE5.5, inline semble interdire tout ce qui confère une
extra-longueur: width comme padding.
C'est mieux avec inline-block que IE5.5 reconnaît bien, mais qui évidemment
pose d'autres problèmes...
J'ai souvenir qu'au début j'avais même tenté de réserver la place avec un
GIF transparent, mais c'était aussi lourd que dégueu, alors comme c'est
mineur, j'ai laissé tomber pour IE5.5.
--
Cordialement.
--
* Patrick BRUNET www.ipzb.fr www.ipzb-pro.com
* E-mail: lien sur http://zener131.eu/ContactMe
"SAM" a écrit dans le message de news: 4916c0b6$0$881$
Le 11/9/08 11:21 AM, Patrick 'Zener' Brunet a écrit : > "SAM" > a écrit dans le message > de news: 4916130e$0$969$ >> [...] > >> div.titelg { >> background: url(fleche.gif) no-repeat left center #00c; >> font-size: 120%; >> padding-left: 60px; >> } >> > > Tiens, tu as un truc 100% fiable pour faire ça avec > un container qui soit un inline ?
Là çà fonctionne impec dans un span tant avec IE6 que 7 (et bien sûr tous les autres brouteurs graphiques non IE)
> Typiquement pour rajouter une iconette (fournie par la CSS) > via un background-image à un lien au milieu du texte.
Faut pas non plus pousser mèmère dans les orties !
Néanmoins ...
<a href="#">Mon lien (<span class="option">option 1</span>) du jour</a>
yapas d'raison que ça ne fonctionne pas avec une css comme :
.option { background: url(plus.gif) no-repeat left center #ccc; font-size: 120%; padding-left: 40px; }
> Evidemment entre IE et les autres, ça ne se passe pas pareil...
Si, si, ça passe exactement pareil (à vérifier pour IE.5.5).
Alors j'ai fait un bilan (j'utilise ça sur mes sites pour les liens "page suivante/page précédente", et aussi pour les iconettes de lien sortant.
Avec inline et un padding, ça marche bien même sur IE6, par contre sur IE5.5, le padding est ignoré et l'iconette se trouve sous le texte. En fait sur IE5.5, inline semble interdire tout ce qui confère une extra-longueur: width comme padding.
C'est mieux avec inline-block que IE5.5 reconnaît bien, mais qui évidemment pose d'autres problèmes...
J'ai souvenir qu'au début j'avais même tenté de réserver la place avec un GIF transparent, mais c'était aussi lourd que dégueu, alors comme c'est mineur, j'ai laissé tomber pour IE5.5.
-- Cordialement. -- * Patrick BRUNET www.ipzb.fr www.ipzb-pro.com * E-mail: lien sur http://zener131.eu/ContactMe
