28173 sujets

CSS et mise en forme, CSS3

Hello avant de vous expliquer mon problème je vous donne mon code :



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	
	<style>
		ul {
			margin: 0;
			padding: 0;
		}

		ul#sousMenu1 {
			list-style-type: none;
			background-color: blue;
		}

		ul#sousMenu2 {
			list-style-type: none;
			background-color: red;
		}

		li#idspecial {
			background-color: yellow;
		}
	</style>
</head>

<body>

	<ul id='sousMenu1'>
		<li>1</li>
		
		<li id='idspecial'>
			<ul id='sousMenu2'>
				<li>1.1</li>
				<li>1.2</li>
			</ul>
		</li>
		
		<li>2</li>
		<li>3</li>
	</ul>


</body>

</html>




Mon problème est que mon li "special", celui englobant mon deuxième ul affiche un padding-top apparant sous IE7 que je n'arrive pas à enlever, je souhaiterais obtenir le même affichage que sous Firefox (c'est à dire ne pas afficher la bande jaune en fait).

Une idée ?
Modifié par Sol (04 Jan 2008 - 09:31)
J'ai mis la page en ligne pour plus de commodités :

...
Modifié par Sol (04 Jan 2008 - 09:31)
Bonjour,

Je n'ai pas la moindre idée de l'origine du bug, mais pour une solution:
li#idspecial {width: 100%;}

Voir dans la FAQ la partie sur le HasLayout.