28172 sujets

CSS et mise en forme, CSS3

Hello cela fait longtemps que je n'ai pas poster sur le forum Smiley smile .

Voila j'ai une grosse galère sur un site.

J'ai ces styles


#content-popin .pictures-nav li {
	display: inline-block;
	margin-left: 10px;
	*display: inline; *zoom: 1;/* IE7 */
}
#content-popin .pictures-nav li:first-child {
	margin-left: 0;
}
#content-popin .pictures-nav input {
	position: absolute;
    top: -10000px;
    width: 58px;  
	height: 58px;
	display:block;
}
#content-popin .pictures-nav label {
	display: block;
	position:relative;
	width: 58px;  
	height: 58px;
	text-indent: -1000px;
	overflow: hidden;
	margin-left:0px;
	cursor: pointer;
}


Sachant que j'ai une image de fond en plus sur le label.

Le text-indent fait bugger ma liste d'image sur ie7, le navigateur réagit comme si les li était vide.

Sur ie8 tout va bien.

Je ne sais absolument plus quoi faire pour corriger ce soucis avez vous déjà rencontré ce cas de figure?

Merci par avance
Hello.

Pas souvenir d'avoir eu des soucis avec text-indent sous IE. Quel est ton HTML? Sans, difficile de t'aider.
Merci pour ta réponse,

Voici ci-dessous le code html associé.


<div class="pictures-nav">
	<div class="menu">
		<button>MORE PHOTOS</button>
	</div>
	
	<ul>
		<li>
			<input type="radio" checked="checked" name="current_picture" value="#picture0" id="picture-choice0">
			<label style="background-image: url('/uploads/ambassadorbioimg/4e76c70c53a4b803cb35d24f63718c7f3327bfd7.jpg');" for="picture-choice0" class="checked">Picture 0</label>
		</li>
		<li>
			<input type="radio" name="current_picture" value="#picture1" id="picture-choice1">
			<label style="background-image: url('/uploads/ambassadorbioimg/f809244e83527a9879548acd043b102e1e3e8bfb.jpg');" for="picture-choice1">Picture 1</label>
		</li>
	</ul>

	<a href="#" class="close-picts"></a>
</div>


En espérant trouvez de l'aide parmis vous Smiley smile
J'ai fait un petit Dabblet de ton code (résultant ici, pour IE7).

J'ai exactement le même résultat sous FF, IE7 et 8. (à savoir un bouton et deux carrés de bacon).

En fait, plus je lis ton code, et moins je comprends. Quel rendu visuel tu cherches à obtenir au juste?