Séparateur entre 2 : <li></li>(séparateur)<li></li> sous IE7

**nico44530** · 09/07/2012, 23h49

Bonjour,

J'ai un problème de compatibilité avec IE7.

Voici le code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<ul>
<li></li>
<span class="separator">-</span>
<li></li>
<span class="separator">-</span>
<li></li>
</ul>

Voici le code CSS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
span.separator {
	font-size: 11px;
	float: left;
	margin-top: 5px;
}

Ce code ne fonctionne pas sous IE7, mais fonctionne sur tous les autres navigateurs

Voir le résultat souhaité :

Le résultat sous IE7 est le même sans les "-" entres chaque items

Merci d'avance pour vos réponses

**c_s_s** · 10/07/2012, 11h25

Bonjour,

Ton code n'est pas correct, tu ne dois rien mettre entre </li> et <li>.

Au pire, tu peux faire ça :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<ul>
   <li></li>
   <li class="separator">-</li>
   <li></li>
   <li class="separator">-</li>
   <li></li>
</ul>

**Muchos** · 10/07/2012, 21h18

On est sur un thread css ou quoi ?!
Je propose :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<head>
	<style type="text/css">
                .stat-site {padding: 0;}
                .stat-site li {display: inline;}
                .stat-today:before, .stat-today:after {content: "\00A0\2012\00A0";}
        </style>
</head>
<body>
	<ul class="stat-site">
		<li><b>1</b> visiteur connecté</li>
		<li class="stat-today"><b>11</b> visiteurs aujourd'hui</li>
		<li><b>11</b> visites au total</li>
	</ul>
</body>

**c_s_s** · 11/07/2012, 10h33

Envoyé par Muchos

On est sur un thread css ou quoi ?!

Oui. Est-ce que ça empêche pour autant de donner des conseils sur le code HTML, j'en doute.

L'utilisation des pseudos éléments :before est :after est intéressante mais n'oublie pas d'indiquer à nico44530 la marche à suivre pour que ça fonctionne aussi sous IE7, puisqu'il semble aussi se soucier de l'affichage sur ce navigateur.

Séparateur entre 2 : <li></li>(séparateur)<li></li> sous IE7

CSS

Vue hybride

Discussions similaires

Partager

Partager