28172 sujets

CSS et mise en forme, CSS3

Bonjour à toutes et tous,

Je suis face à un problème de mise en forme diiférente d'un sous menu selon qu'il apparait sous FF ou sous IE,
sur le site suivant :
http://laposte-test.cvf.fr/laposterh/spip/

Sous FireFox, aucun problème, le sous-menu qui apparait au survol est OK, chaque item est sur 1 ligne
Sous IE, le premier item est sur une ligne, et tous les autres en dessous s'afiichent sur 2 lignes
alors qu'il y a largement laplace de s'affhicher sur 1 seule ligne !
Au niveau CSS :
il s'agit d'une structure ul li ul li (avec le JS d'AlsaCreations pour le déroulement au survol)
La CSS correspondante : (excuse-moi Ghost pour le position / display / float sur le même élément, j'ai bcp tatonné !)

Merci de votre aide !
A+
V@l


div.rubriques ul li ul {
	position: absolute;
	display: block;
	float: left;
	width: 220px;
	list-style-type: square;
	left: 1.7em;
	top: 1.4em;
	border:1px solid black;
	background-color: white;
}


div.rubriques  ul li ul li {
	float: left;
	clear: left;
}

div.rubriques ul li ul li a:link,
div.rubriques ul li ul li a:active,
div.rubriques ul li ul li a:hover,
div.rubriques ul li ul li a:visited {
	display:inline;
	color: rgb(17,61,111); /* #113D6F Bleu foncé menu*/
	background-color: white;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
	font-variant: normal;
}

Modifié par V@lerie (03 Jun 2008 - 18:41)
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Administrateur
Bonjour,

à la règle ligne 322 de squelettes/styles.css (la dernière règle dans ton message), rajouter l'instruction
white-space: nowrap;
règle le problème sous IE6. Smiley cligne
J'ignore par contre le pourquoi du problème original Smiley decu
Modifié par Felipe (01 Jun 2008 - 11:35)
Bonjour Felipe, merci pour l'astuce, je l'ai rajouté dans la CSS là où tu me l'as indiqué. Pour l'instant, je ne peux visualiser que sous IE7, et visiblement, IE7 ne semble pas en tenir compte... je regarderai sous IE6 demain pour voir ce que ça donne. S'il existe d'autres astuces pour IE7, je reste preneuse...

Mikachu, je vais me rendre courtoise et lire les règles à suivre pour participer au forum. Smiley smile

V@lérie
Salut,

Bah je ne dis plus rien Smiley cligne , mais je n'ai pas compris ou était le problème, quoique je n'ai pas visionné sous ie6 Smiley lol
Ca marche !!
Génial, c'est nickel ! sous IE6 ET IE7 !! (peut-être un souci de visage de cache un peu long...)

Merci Felipe, (Ghost aussi Smiley langue !)