28173 sujets

CSS et mise en forme, CSS3

Placement impossible en IE

Bonjour!

A la page http://www.bregnard.org/test2/sommaire.html, je n'arrive pas du tout à placer correctement les titres des menu "Services, Région et Newseltter" (à gauche). En fait, le décalage a lieu dans IE (ok pour FF) depuis que j'ai placé les listes.

Est-ce que quelqu'un arrive à m'aider, cela fait 3 heures que je piétine...

Merci

Pascal
Modifié par pbpub (29 Sep 2006 - 22:33)
Le problème vient du fait que chaque navigateur à son lot d'attribut prédéfinis avant meme de charger ta CSS.

La solution ? Redefinir tous les attributs suceptibles d'altérer l'affichage. Je ne sais pas si c'est valide, ni recommandé par les hautes instances :x mais je met toujours en premiere occurence dans ma css :

*{margin:0; padding:0;}


Ca me permet de partir ainsi d'une CSS quasiment vierge de tout attributs Smiley smile

Pour ton cas précis, tu devrais essayer de définir les margin et padding de tes titres
Modifié par noklio (30 Sep 2006 - 12:55)
*{margin:0; padding:0;}


En fait, je fais déjà cela.

Il semble que c'est quand j'introduis des listes que cela pousse les cases inférieures vers le bas. En effet, quand je les enlève tout redevient normal...

http://forum.alsacreations.com/faq/#item44, j'ai déjà visité cette page mais je n'ai pas trouvez la solution. J'ai simplement pu identifier que c'est la liste qui pose problème.

J'ai essayé de mettre des overflow hidden un peu partout mais rien à faire... Smiley confus .

Merci si quelqu'un arrive à m'aider...
J'ai pu isoler le problème: c'est le ul qui pose problème. Si j'ajoute style="width:25px" au menu (ul) d' "zoom", cela règle le problème:

<h1 class="menuTitre actumenuTitre">Zoom</h1>
<ul class="menuListe" style="height:25px">
<li><a href="http://www.pasaj.ch">Zoom1</a></li>
<li><a href="http://www.pasaj.ch">Zoom2</a></li>
</ul>


Le css est

.menuListe a{
	margin: 0px 0px 0px 40px;
	padding:0px;
	display: block;
	text-decoration: none;
	color: #0000FF;
	text-indent: 17px;
	background-image:url(images-structure/puce.gif);
	background-position: left;
	background-repeat: no-repeat;
	line-height: 12px;
	font-weight: bold;
	font-size: 10px;
}


Mais ce n'est pas très élégant. Y aurait-il un truc pour empêcher IE d'allonger la liste sans utilisté (les margin et les padding sont déjà spécifiés).

Merci de l'aide!
Modifié par pbpub (01 Oct 2006 - 22:04)
Sujet clos
Aller à