18041 sujets

Questions générales et questions de débutants

Texte qui se deplace sous Firefox

Bonjour,
J'ai un petit soucis avec mon site, le problème est présent uniquement sous Firefox.
Dès que je passe sur mon menu j'ai mon contenu qui se déplace.

J'ai fait une page de test de mon site : Demo

CSS

body {
	margin: 0;
	padding: 0;
	background: white;
	font: 80% verdana, arial, sans-serif;
}

img {
	border: 0;
}

dl, dt, dd, ul, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#menu {
	position: relative;
	width: 620px;
	height: 24px;
	left: 360px;
	background: #D1D26B;
}

#menu dl {
	float: left;
	width: 9.5em;
}

#menu dt {
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	background: #d1d26b;
	border: none;	
	margin: 0px;
	height: 24px;
	width: 120px;
}

#menu dd {
	display: none;
	border: 0;
	width: 120px;
}

#menu li {
	text-align: left;
	text-indent: 5px;
	background: #d1d26b;
	width: 140px;
}

#menu li a, #menu dt a {
	color: #950f5a;
	text-decoration: none;
	display: block;
	height: 20px;
	border: 0 none;
}

#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
	background: #99CC33;
}

div#entete {
	margin-left: auto;
	margin-right: auto;
	background-image: url(images/entete.gif);
	background-repeat: no-repeat;
	width: 980px;
	height: 250px;
	padding: 0;
}
div#banniere {
	margin-left: auto;
	margin-right: auto;
	width: 980px;
	height: 220px;
	background-color: #99CC33;
}

div#contenu {
	margin-left: auto;
	margin-right: auto;
	width: 980px;
	height: 400px;
	background-color: #EEEEEE;
}

div#pieddepage {
	margin-left: auto;
	margin-right: auto;
	width: 980px;
	height: 20px;
	text-align: center;
	font-weight: bold;
	color: #EEEEEE;
	background-color: #99CC33;
}


PAGE

 <!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="en" xml:lang="en">
	<head>
		<title></title>
		<link rel="stylesheet" href="menu.css" type="text/css" />
		<script src="menu.js" type="text/javascript"></script>
	</head>
<body>
<?php
	include 'entete.php';
?>
index
<?php
	include 'pied_de_page.php';
?>


ENTETE

<div id="entete">
	<div id="banniere" onclick="location.href='index.php';" style="cursor: pointer;"></div>
	<div id="menu">
		<dl>
			<dt onmouseover="javascript:montre('smenu1');">Menu1</dt>
				<dd id="smenu1">
					<ul>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
					</ul>
				</dd>
		</dl>
		<dl>
			<dt onmouseover="javascript:montre('smenu2');">Menu2</dt>
				<dd id="smenu2">
					<ul>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
					</ul>
				</dd>
		</dl>
		<dl>
			<dt onmouseover="javascript:montre('smenu3');">menu3</dt>
				<dd id="smenu3">
					<ul>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
					</ul>
				</dd>
		</dl>
		<dl>	
			<dt onmouseover="javascript:montre('smenu4');">menu4</dt>
				<dd id="smenu4">
					<ul>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
						<li><a href="historique.php">sous-menu</a></li>
					</ul>
				</dd>
		</dl>
		<dl>	
			<dt onmouseover="javascript:montre();">Menu5</a></dt>
		</dl>
	</div>
</div>
<div id="contenu">

Modifié par kobasen (12 Jul 2007 - 16:20)
Sujet clos
Aller à