Aller au contenu

Position ?


catseb

Sujets conseillés

Bonjour,

J'ai un petit souci avec mon menu dont voici les codes.

Il s'affiche correctement sous IE mais une barre entre mon entete et mon menu "s'insere" sous Firefox (pour une fois).

D'où mes questions :

1 - Comment réduire la taille du menu sur sa hauteur et comment éliminer ce petit souci sous FF.

2 - Si une ame charitable peut m'expliquer le pourquoi de ce petit souci, et a l'occasion m'expliquer les fonctions navlist et leurs differences (je les ai utilisées pour la 1e fois) : ce serait formidable.

Merci a tous par avance du temps consacre a l'étude de ce post.

Code html :

<!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>AB CS... ... </title>
<style type="text/css" media="screen">@import url(menuaccueil.css);</style>
</head>

<body>
<div class="conteneur">
<div class="banniere">
<div class="logo"> <img src="file:///C|/AtoutBio/images/tournesolentete.jpg" alt="Grenouille" width="247" height="100" /></div>
<div class="tournesol"><img src="file:///C|/AtoutBio/images/tournesold.jpg" alt="Fleur Tournesol" width="191" height="100" /></div>
</div>
<div class="hautmenu">
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Accueil</a></li>
<li><a href="#">Menu A</a></li>
<li><a href="#">Menu B;</a></li>
<li><a href="#">Menu C</a></li>
<li><a href="#">Menu D</a></li>
</ul>
</div>
</div>
<div class="gauche">
<h3>menu</h3>
<ul>
<li><a href="#">Lien</a></li>
<li><a href="#">Lien</a></li>
<li><a href="#">Lien</a></li>
<li><a href="#">Lien</a></li>
</ul>
</div>

<div class="corps"><p> </p>
<p> </p>
<p>
ErrorDocument 401 [url="http://401.html"]http://401.html[/url] <cite>=> Erreur 401 accès non autorisé.</cite></p>
<p> ErrorDocument 402 [url="http://402.html"]http://402.html[/url] <cite>=> Erreur 402 reformuler votre paiement.</cite><br/>
ErrorDocument 403 [url="http://403.html"]http://403.html[/url] <cite>=> Erreur 403 accès interdit.</cite><br/>
ErrorDocument 404 [url="http://404.html"]http://404.html[/url] <cite>=> Erreur 404 non trouvé.</cite><br/>
ErrorDocument 500 [url="http://500.html"]http://500.html[/url] <cite>=> Erreur 500 erreur interne.</cite></p>
<span class="tire"></span>
../..
</div>
<div class="pied">
<p>Pied de page... ... ... </p>
</div>
</div>

</body>
</html>

Code CSS externe

#navlist ul
{
margin: 0;
white-space: nowrap;
padding: 0;
}

#navlist li
{
display: inline;
list-style-type: none;
}

#navlist a
{
padding: 1px 8px 1px 24px;
border: 1px solid #333;
background-color: #999;
background-image: url(images/l1_down.gif);
}

#navlist a:link, #navlist a:visited
{
color: #EEE;
text-decoration: none;
}

#navlist a:hover
{
border: 1px solid #333;
background-color: #FF6600;
background-image: url(images/l1_over.gif);
color: #333;
}

#active a:link, #active a:visited, #active a:hover
{
border: 1px solid #333;
background-color: #FF6600;
background-image: url(images/l1_over.gif);
color: #333;
}

<style type="text/css" media="screen">
body {margin:10px;}
div.conteneur {border:1px solid #666;background-color:gray;}
div.banniere {background-image:url(file:///C|/AtoutBio/images/degradentete.jpg);height:100px;border-bottom:1px solid #666;}
div.logo {position:absolute;}
div.tournesol {position:absolute; right:10px;}
div.hautmenu {height:30px; background-color:#66FF00;}

div.gauche {width:140px;float:left;margin-bottom:-1.2em;padding:5px;padding-top:30px;}
div.corps {margin-right:0;margin-left:150px;border-left:1px solid #666;padding:5px;background-color:white;}
div.pied {background-color:yellow;height:30px;border-top:1px solid #666;line-height:30px;text-align:center}
.tire {clear:both;padding:0 5px;display:block;}
h1, p{margin:0;}
</style>

Lien vers le commentaire
Partager sur d’autres sites

Comme tous bon webmaster, nous sommes de grosses faignasses, donc avec un screen qui montre le probleme ou un petit lien, tu aurai plus de chances d'avoir une réponse rapide.

Sinon, puis que je suis tres charitable, j'ai jeté un oeil, cela ne viendrai t-il pas de cette propriété:

div.hautmenu {height:30px; background-color:#66FF00;}

qui est celle de ta div contenant ton menu?

Donc si j'ai bien compris vire le height:30px; et ça devrais fonctionner...

sinon j'ai mal compris

Lien vers le commentaire
Partager sur d’autres sites

J essaie ca de suite et sinon promis je fais des aujourd hui le necessaire pour le mettre en ligne et vous faciliter la tache.

Et puis, apres tout, vous avez bien raison, vous faites l effort d aider, donc a moi de faire au mieux pour vous faciliter la tache ;-)

Merci je vous donne un lien des que possible

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...