Votre question

menu php au centre de la page

Tags :
  • Php
  • Html
  • Programmation
Dernière réponse : dans Programmation
1 Novembre 2011 15:16:16

Bonjour,

J'ai réussi à trouver un code pour avoir un menu déroulant.

Il se compose du code que j'ai mis dans le fichier menu.php
D'une page css et d'une page function

Mon problème c'est que quand j'insère le code dans mon fichier menu.php cela m'affiche ensuite au centre de la page alors que mon menu doit être sur la gauche.

Pourquoi ? Merci d'avance



<!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>Menu déroulant vertical sur clic</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="functions.js"></script>
</head>
<body>

<div id="menu">
<div class="menu" id="menu1" onclick="afficheMenu(this)">
<a href="#">Menu 1</a>
</div>
<div id="sousmenu1" style="display:none">
<div class="sousmenu">
<a href="#">Sous-Menu 1.1</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 1.2</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 1.3</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 1.4</a>
</div>
</div>

<div class="menu" id="menu2" onclick="afficheMenu(this)">
<a href="#">Menu 2</a>
</div>
<div id="sousmenu2" style="display:none">
<div class="sousmenu">
<a href="#">Sous-Menu 2.1</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 2.2</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 2.3</a>
</div>
</div>

<div class="menu" id="menu3" onclick="afficheMenu(this)">
<a href="#">Menu 3</a>
</div>

<div class="menu" id="menu4" onclick="afficheMenu(this)">
<a href="#">Menu 4</a>
</div>
<div id="sousmenu4" style="display:none">
<div class="sousmenu">
<a href="#" >Sous-Menu 4.1</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 4.2</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 4.3</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 4.4</a>
</div>
<div class="sousmenu">
<a href="#">Sous-Menu 4.5</a>
</div>
</div>
</div>

</body>
</html>

Autres pages sur : menu php centre page

a c 232 L Programmation
1 Novembre 2011 16:10:03

Salut,

Tu n'as pas fourni le CSS avec, et c'est certainement lui qui centre le tout.
Avec un margin: 0 auto; ou un margin: auto;
1 Novembre 2011 19:22:56

Merci ...

Le CSS de mon ancien menu (version html) est celui-ci je crois

/***********************************************/
/* Layout Divs */
/***********************************************/
#pagecell1{
position:absolute;
top: 163px;
left: 0px;
right: 2%;
width:95.6%;
background-color: #ffffff;
height: 672px;
}

#tl {
position:absolute;
top: 3px;
left: -3px;
margin: 0px;
padding: 0px;
z-index: 100;
}

#tr {
position:absolute;
top: -1px;
right: -1px;
margin: 0px;
padding: 0px;
z-index: 100;
}

#masthead{
position: absolute;
top: 36px;
left: 17px;
right: 2%;
width:95.6%;

}

#pageNav{
float: left;
width:200px;
padding: 0px;
background-color: #F5f7f7;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
font: small Verdana,sans-serif;
}

#content{
padding: 0px 10px 0px 0px;
margin:0px 0px 0px 200px;
border-left: 1px solid #ccd2d2;

}



Du coup comment l'adapter au CSS de mon nouveau menu déroulant ici :

*{
margin:0;
padding:0;
}
#menu{
width:150px;
margin:0;
}
.menu, .sousmenu{
text-align:center;
}
.menu{
height:18px;
width:150px;
padding:2px 0;
background:#404040;
color:#fff;
}
.sousmenu{
height:18px;
width:150px;
padding:1px 0;
background:#808080;
color:#fff;
}
.menu a{
display:block;
width:100%;
height:100%;
color:#fff;
font-family:arial,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
background:#404040;
}
.sousmenu a{
display:block;
width:100%;
height:100%;
color:#fff;
font-family:arial,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
background:#808080;
}
.menu a:hover, .sousmenu a:hover, .menu a:active, .sousmenu a:active, .menu a:focus, .sousmenu a:focus{
background:#ca0008;
}

Contenus similaires
a c 232 L Programmation
1 Novembre 2011 20:42:14

Avec ton code, le menu n'est pas centré.
1 Novembre 2011 21:10:11

Merci j'ai réussi à me dépatouiller du truc.

Encore une question ....

Lorsque j'ajoute des éléments dans mon menu ils font descendre le milieu de ma page.

Comment faire ? Merkii encore et désolé de mon idiotie
a c 232 L Programmation
1 Novembre 2011 21:27:52

T'as pas un lien vers ta page ? Parce que c'est pas pratique là
1 Novembre 2011 21:31:07

Il fallait que je rajoute position absolute. MErci pour votre aide sur ce sujet
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS