28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je viens de m'inscrire afin de poster mon 1er message, car je galère Smiley ohwell

J'ai créé un blog pour un camping (blog-laguyonniere.com).

Dans le menu horizontal, je souhaiterais placer "Nouveautés 2011" à la suite de ce menu et non pas en-dessous.
Ensuite, je souhaiterais ajouter une couleur de fond afin de le faire ressortir comme sur ce gros sitewww.govoyages.com à titre d'exemple.

<ul class="nav superfish">



<?php $pages = "&exclude=112".get_option('ppm_ex_pages'); ?>



		<li <?php if(is_home()){echo 'class="current_page_item page_item"';}?>><a href="<?php bloginfo('siteurl'); ?>/" title="Home">Accueil</a></li>

		<?php wp_list_categories('depth=1&hide_empty=0&orderby=name&order=ASC&title_li=' ); ?>
		<?php wp_list_pages('sort_column=menu_order&depth=3&title_li='.$pages);?>
		<a title="Nouveautés camping" href="http://blog-laguyonniere.com/nouveautes-2011-camping/" target="_blank">Nouveautes 2011</a>

</ul>


J'ai rajouté le lien en dur mais je ne crois pas que ce soit la solution idéale. Smiley biggol

N'hésitez pas à me poser des questions pour en savoir plus.

Merci Smiley biggrin
Salut,

Je n'ai pas bien regardé ce que faisait ton code PHP, mais ton dernier lien n'est pas dans une balise <li></li> comme les autres. Ton code devrait donner ça :
<ul class="nav superfish">

		<li ><a href="<?php bloginfo('siteurl'); ?>/" title="Home">Accueil</a></li>

		[b][#red]<li>[/#][/b]<a title="Nouveautés camping" href="http://blog-laguyonniere.com/nouveautes-2011-camping/" target="_blank">Nouveautes 2011</a>[b][#rouge]</li>[/#][/b]</ul> 

Modifié par Jordi (02 Mar 2011 - 14:36)
Parfait Jordi, désormais mon menu est aligné! Smiley lol Merci
Je n'ai plus qu'à chercher le code pour mettre une couleur de fond, mais ce sera plus facile je pense. Je reviendrais reposter un message quand j'aurai trouvé l'attribut en question. Smiley cligne
Modifié par JeromeLaDgig (02 Mar 2011 - 12:28)
Pour la couleur de fond, c'est dans la feuille de style que tu dois gérer ça :
ul.nav li {
    background-color: red;
}

Si tu veux que la couleur change au survol, tu ajoutes :
ul.nav li:hover {
    background-color: #CCC;
}

Tu trouveras les codes couleurs hexadécimaux dans un logiciel graphique (type Gimp ou Photoshop).
Merci de ton aide Jordi Smiley biggrin , mais je pense avoir (encore) besoin de toi... Smiley decu

Sais-tu comment faire pour qu'une partie de mon menu soit surligné.
Comment isoler "Nouveautés 2011" pour lui appliquer la couleur de fond?
Bonjour,
Pour répondre à ta dernière question, il suffit de donner un attribut id="nouveautes" à ce li qui contient "Nouveautés 2011" et de lui donner du style dans le CSS, par exemple :


#nouveautes {background-color:black; color:white}


Cordialement
Bonjour lddsoft et merci de ta contribution. Smiley lol

J'ai bien compris le pourquoi du comment il faut ajouter id=. En revanche, ce que je ne sais pas, c'est où et comment placer cette balise? J'ai essayé ces deux choix, pour l'instant, sans résultats.
		<li><div id="nouveautes"><a title="Nouveautés camping" href="http://blog-laguyonniere.com/nouveautes-2011-camping/" target="_blank">Nouveautes 2011</a></li>

et
<li><id="nouveautes"><a title="Nouveautés camping" href="http://blog-laguyonniere.com/nouveautes-2011-camping/" target="_blank">Nouveautes 2011</a></li>
Dans les 2 cas, tu as faux !

1er cas : il manque la balise fermante </div>
2e cas : la balise <id> n'existe pas.

Voici ce que tu dois faire :

<li id="nouveautes"><a title="Nouveautés camping" href="http://blog-laguyonniere.com/nouveautes-2011-camping/" target="_blank">Nouveautes 2011</a></li>


De plus, en ce qui concerne ton lien, s'il renvoie vers une page de ton site (blog), il serait préférable d'utiliser un chemin relatif, plutôt qu'absolu. Smiley cligne

Cordialement
Modifié par lddsoft (07 Mar 2011 - 13:29)
Encore merci lddsoft! C'est exactement ce que je souhaitais.

Oui, je suis d'accord avec toi, mais le fait d'insérer un lien en dur est beaucoup plus facile pour moi. Le PhP, je ne connais que très peu de chose Smiley confused et je ne veux pas paraitre pour un assisté Smiley lol , c'est souvent mal vu, sur les forums.
Modifié par JeromeLaDgig (07 Mar 2011 - 14:44)