barre css en dessou d'un header, soucis

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par user2home, 5 Décembre 2009.

  1. user2home
    user2home WRInaute occasionnel
    Inscrit:
    19 Décembre 2007
    Messages:
    251
    J'aime reçus:
    0
    Salutations, je me permet de poster car j'ai un gros soucis au niveau css, je cherche à intégrer un menu sous ma bannière.
    Après beaucoup de tentative, avec différente manière impossible d'arriver au résultat voulu.

    Je cherche à intégrer le menu juste en dessou de mon header.

    Lors de sa mise en place, j'ai tous le reste qui se décale, donc j'ai bien ma petite barre de menu qui s 'affiche sous mon header, mais le reste fout le camps .. et impossible de résoudre le problème.

    Cordialement

    J'ai mon header
    Code:
    #header {
    background: url(images/header.jpg) no-repeat;
    height: 300px;
    margin: 3px;
    padding: 0px;
    }
    Et mon menu,
    Code:
    /* Style appliqué au menu sous le title */
    ul#menu, .menu ul
    {
    	width:974px;
    	height:33px;
    	background-color:#d5c6a6;
    	background-image:url(images/menu.png);
    	list-style-type:none;
    	font-family:Georgia, "Times New Roman", Times, serif;
    	font-size:18px;
    }
    
    ul#menu li, .menu ul li
    {
    	float:left;
    	margin-top:7px;
    	padding:0 5px;
    	border-right:#333333 1px dotted;
    	margin-left:0;
    }
    
    ul#menu li a:link, ul#menu li a:visited, .menu ul li a:link, .menu ul li a:visited
    {
    	display:block;
    	text-align:center;
    	padding:0 15px;
    	text-decoration:none;
    	color:#333333;
    }
    
    
    ul#menu li a:hover, ul#menu li a:active, .menu ul li a:hover, .menu ul li a:active, ul#menu li.current_page_item a, .menu ul li.current_page_item a:link, .menu ul li.current_page_item a:visited, .menu ul li.current_page_item a:hover, .menu ul .current_page_item a:active
    {
    	background-color:#ffffff;
    	text-decoration:none;
    	color:#cc3300;
    }
    
    ul#menu li li
    {
    	border-right:none;
    	margin:0;
    	margin-top:1px;
    	width:120px;
    	padding:0;
    }
    
    ul#menu li li li
    {
    	padding-left:1px;
    }
    	
    ul#menu li li a, ul#menu li li a:link, ul#menu li li a:visited
    {
    	background:#d5c6a6 url(images/submenu.png) bottom;
    	width:120px;
    	color:#333333;
    	font-size:16px;
    	font-family:Georgia, "Times New Roman", Times, serif;
    	margin:0;
    	line-height:25px;
    	text-align:left;
    }
    	
    ul#menu li li a:hover, ul#menu li li a:active
    {
    	background:#FFFFFF;
    	color:#cc3300;
    }
    
    ul#menu li ul
    {
    	z-index:9999;
    	position:absolute;
    	left:-999em;
    	height:auto;
    	width:150px;
    	margin:0;
    	padding:0;
    	list-style-type:none;
    }
    
    ul#menu li ul a
    { 
    	width:120px;
    }
    
    ul#menu li ul ul
    {
    	margin:-26px 0 0 150px;
    }
    
    ul#menu li:hover ul ul, ul#menu li:hover ul ul ul
    {
    	left:-999em;
    }
    
    ul#menu li:hover ul, ul#menu li.sfhover ul, ul#menu li li:hover ul, ul#menu li li.sfhover ul, ul#menu li li li:hover ul, ul#menu li li li.sfhover ul
    {
    	left: auto;
    }
    
    ul#menu li:hover, ul#menu li.sfhover
    { 
    	position: static;
    }
    
    Mon menu inséré en dessou du div header,
    Code:
    <ul id="menu">
          <li<?php if(is_home()) echo ' class="current_page_item"'; ?>><a href="<?php echo get_option('home'); ?>/">Home</a></li>
          <?php wp_list_pages('sort_column=menu_order&title_li=&number=6'); ?>
        </ul><!-- /menu --></div> 
     
  2. jcaron
    jcaron WRInaute accro
    Inscrit:
    13 Février 2004
    Messages:
    2 579
    J'aime reçus:
    0
    Ce serait quand même nettement plus simple et plus efficace si tu nous donnais un lien vers la page en question.

    Tu as bien noté que le code que tu donnes a un </div> mais pas de <div>? Tu as passé ta page au validateur W3C avant et après l'insertion de ton code?

    Jacques.
     
  3. tryan
    tryan WRInaute passionné
    Inscrit:
    20 Février 2005
    Messages:
    2 229
    J'aime reçus:
    0
    Salut,

    Et avec une position:absolute; ou position:relative; à ton menu, ça ne change rien ?
     
  4. Rod la Kox
    Rod la Kox WRInaute accro
    Inscrit:
    24 Juin 2008
    Messages:
    2 780
    J'aime reçus:
    0
    C'est quoi le plus important, la barre de menu ou le bandeau ?
    Commence par mettre la barre et ensuite repasse si tu a des soucis pour placer ton bandeau...
     
  5. user2home
    user2home WRInaute occasionnel
    Inscrit:
    19 Décembre 2007
    Messages:
    251
    J'aime reçus:
    0
    Le soucis, est que mon thème est deja actif, c'est donc juste un ajout, et c'est la que ca se complique. :?
     
  6. bproductiv
    bproductiv WRInaute accro
    Inscrit:
    27 Décembre 2004
    Messages:
    3 672
    J'aime reçus:
    0
Chargement...
Similar Threads - barre css dessou Forum Date
Trafic SEO s'effondre - Comment redresser la barre ? - Site e-commerce Débuter en référencement 19 Mars 2019
Besoin d'aide concernant modification sur mon blog dans la barre URL. Développement d'un site Web ou d'une appli mobile 25 Juillet 2018
Faut-il faire 2 parties dans balise title séparées par barre verticale ? Référencement Google 21 Juin 2017
Voir le mur de n'importe qui en tapant simplement son nom dans la barre FB Facebook 17 Février 2016
site avec une barre oblique ?? Demandes d'avis et de conseils sur vos sites 3 Décembre 2015
Afficher une barre pour accepter les cookies Développement d'un site Web ou d'une appli mobile 17 Juin 2015
Titre du site dans la barre de navigation ou pas ? Débuter en référencement 21 Février 2015
La barre oblique "/" est elle equivalente au tiret "-" pour les mots clés dans les URL Rédaction web et référencement 21 Octobre 2013
rajouter les www à ma boutique dans la barre d'adresse URL Rewriting et .htaccess 11 Octobre 2013
Problème concernant la barre latérale de droite fil d amis Facebook 8 Avril 2013
Redirection sous-dossier sans affichage dans la barre de navigation Débuter en référencement 4 Avril 2013
Barre menu qui bouge lors du zoom Développement d'un site Web ou d'une appli mobile 15 Février 2013
[Comprendre] Nouvelle barre sur Google Google : l'entreprise, les sites web, les services 22 Novembre 2012
Nouvelle SERP Google [barre de menus en haut - nov. 2012] Google : l'entreprise, les sites web, les services 21 Novembre 2012
clavier sur iphone, insérer le @ et le . à côté de la barre d'espace Développement d'un site Web ou d'une appli mobile 17 Août 2012
Barre Full Width Développement d'un site Web ou d'une appli mobile 23 Juin 2012
L'URL dans la barre d'adresse ne prend pas en compte les dossiers URL Rewriting et .htaccess 12 Mai 2012
Disparition barre latérale gauche Google Analytics 1 Mai 2012
Ma Fanpage n'apparait pas dans la barre de recherche Facebook 12 Avril 2012
Barre de navigation UBERMENU et SEO? Référencement Google 25 Mars 2012