[Résolu] Lettrine dans les menus

flipflip

Bonjour,

Pour un site un client me demande de mettre une lettrine avec une police différente du reste du mot dans la fonction staticList qui renvoie la liste des pages statiques. Est-ce possible sans toucher le core ?

Merci d'avance.

zakar!

Ho que oui !
Dans ta css ajoute en changeant le paragraphe par ce que tu veux (p, h1, h2, span ....)

p:first-letter { font:30px/24px Baskerville,"Times New Roman",serif }

Et la police, taille que tu souhaite

flipflip

Merci pour ta réponse.
J'ai testé sur ma liste mais pas de réaction que se soit sur le ul, li ou a

#nav li a {
         font-family: "Conv_pupcat_",Sans-Serif;
         font-size: 1.8em;
}

#nav li a:first-letter {
          font-size: 4em;
 }

La définition de la nouvelle police marche sans problème.

<ul id="nav">
	<li id="static-home"><a href="http://xxxxxx/" class="active" title="Accueil">Accueil</a></li>
	<li id="static-1"><a href="http://xxxxxxx/index.php?static1/profil" class="noactive" title="Profil">Profil</a></li>
	<li id="static-2"><a href="http://xxxxxxxx/index.php?static2/boutique" class="noactive" title="Boutique">Boutique</a></li>
	<li><a class="static noactive" href="http://xxxxxxxxx/index.php?contact">Contact</a></li>
</ul>

zakar!

Ha étonnant ca alors, essaye en forçant pour voir:

#nav li a:first-letter {
          font-size: 4em !important;
 }

Pense a vider le cache de ton navigateur, et si cela fonctionne c'est que tu déclare le même élément de class quelque part d'autre.

flipflip

Je remonte ce vieux post pour la solution. fist-letter s'applique uniquement sur des éléments block donc pour une liste avec un display à inline il faut contourner le truc :

[== CSS ==]
#nav li {
	display: inline;
	margin: 5px 60px 0 0;
	width: 100%;
}

#nav li a {
    display: inline-block;
	font-family: "Conv_pupcat_",Sans-Serif;
	font-size: 1.8em;
}

#nav li a:first-letter {
	font-size: 2em;
}

danielsan

ok merci. genre de truc qu'on peut chercher indéfiniment ...

flipflip

Je confirme j'ai chercher longtemps Mais je n'ai pas encore eu l'occasion de tester avec IE ou Safari...