28220 sujets

CSS et mise en forme, CSS3


<!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" lang="fr" xml:lang="fr">
<head>
    <title></title>

    <meta http-equiv="Content-language" content="fr" />
	<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
	<meta http-equiv="pragma" content="no-cache" />
	<meta http-equiv="Cache-Control" content="no-cache" />
	

	<style type="text/css">
* {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin: 0px;
	padding: 0px;
	border: 0px none;
}

body {
	color: Black; 
	background: White;
	margin: 10px 10px 10px 10px;
}

#menu {
	background-color: White;
	float: left;
	width: 150px;
}

#menu input {
	cursor: pointer;
	text-decoration: none;
	font-size: 10px;
	color: #444444;
	background-color: White;
	text-align: left;
	margin: 0px 0px 0px 2px;
	width: 150px;
}

#menu .menuNiveau1 {
	background-color: #E6FFFF;
	font-size: 10px;
	border: 1px solid #808080;
	margin: 0px 0px 5px 0px;
}

#menu .menuNiveau1 input {
	background-color: #E6FFFF;
}

#menu .menuNiveau1Actif {
	background-color: #6FA8D5;
	font-size: 10px;
	border: 1px solid #808080;
	margin: 0px 0px 5px 0px;
}

#menu .menuNiveau1Actif input {
	background-color: #6FA8D5;
	font-weight: bold;
}

#menu .menuNiveau2 {
	background-color: White;
	font-size: 10px;
	border: 0px none;
	margin: 10px 0px 10px 10px;
}

#menu .menuNiveau2Actif {
	background-color: White;
	font-size: 10px;
	border: 0px none;
	margin: 10px 0px 10px 10px;
}

#menu .menuNiveau2Actif input {
	font-weight: bold;
}


}
	</style>
	
</head>

<body>


			
<div id="menu">
		<form id="menuForm" action="main.php" method="post">

			<p class="menuNiveau1">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Gestion des Elèves" />
			</p>
			
			<p class="menuNiveau1Actif">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Editions globales" />
			</p>
			
			<p class="menuNiveau2">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Elèves" />
			</p>
			
			<p class="menuNiveau2Actif">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Demandes Cantine" />
			</p>
			
			<p class="menuNiveau2">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Demandes fond social" />
			</p>

			
			<p class="menuNiveau1">
				<input type="hidden" name="action" value="accueil" />
				<input type="submit" value="Editions gestionnaire" />
			</p>
			
		</form>
</div>

</body>

</html>


Sous IE
http://img376.imageshack.us/img376/4355/ieavant7xb.gif

Sous Firefox : CE QUE J'AIMERAIS OBTENIR INDIFFEREMMENT DU NAVIGATEUR
http://img353.imageshack.us/img353/5916/ffavant6wq.gif

En ajoutant dans "#menu input" : width: 150px;, on obtient
Sous IE
http://img376.imageshack.us/img376/135/ieapres5kn.gif

Sous Firefox
http://img392.imageshack.us/img392/2650/ffapres3uy.gif

Quelqu'un a une idée ?