Besoin d'aide en CSS

16 janv. 2011, 20:57

Salut tout le monde ! Hum... voici mon probleme.

Je suis en train de créer un site d'aide pour un jeu et je suis rendu à faire mon menu. Dans mon menu, je veux que mes liens aillent un background. Ca j'ai reussi. Mais la mais lien ne sont plus centré dans le menu... Regardez :

Voila j'aimerais que mes textes soient centrés dans le menu...

Merci d'avance

16 janv. 2011, 23:51

Comment est formé ton menu ?
Avec juste l'image on ne peut pas savoir comment tu le construis et donc t'orienter vers la bonne voie.

18 janv. 2011, 04:40

Bah ca depend comment tu vois ca

18 janv. 2011, 09:37

La source!!!!
Avec le css lié!

18 janv. 2011, 14:45

D'accord voici la source de mon menu avec le css relié a mon menu :

HTML :

<div id="menu">	   
	        <div class="element_menu">
			    <h3>Database</h3>
      			<ul>
				    <p><a href="#" class="lien">Builds</a></p>
					<p><a href="#" class="lien">Champions</a></p>
					<p><a href="#" class="lien">Spells</a></p>
				</ul>
	        </div>

            <div class="element_menu">
			    <h3>Site</h3>
      			<ul>
				    <p><a href="#" class="lien">Inscription</a></p>
				</ul>
	        </div>			
        </div>

CSS:

Code : Tout sélectionner

#menu
{
   float: left; /* Le menu flottera à gauche */
   height: 675px;
   width: 135px; /* Très important : donner une taille au menu */
   background-image: url("images/back-menu.png");
   background-repeat; no-repeat;
}

#menu h3
{
    background-image: url("images/back-titre-menu.png");
	background-repeat: no-repeat;
	text-align: center;
	width: 102px;
	height: 58px;
	margin-left: 15px;
	padding-top: 20px;
	font-family: Exocet;
	font-size: 17px;
	color: #df2b2b;
}

#menu a
{
    background-image: url("images/back-lien-menu.png");
	background-repeat: no-repeat;
	width: 124px;
	height: 38px;
	font-family: Exocet;
	font-size: 20px;
	text-align: center;
	color: #df2b2b;
	text-decoration: none;
	margin-left: 0px;
	padding-left : 0px;
}

#menu a:hover
{
    color: white;
}

Voila

18 janv. 2011, 15:57

                       <ul>
                                    <p><a href="#" class="lien">Builds</a></p>
                                        <p><a href="#" class="lien">Champions</a></p>
                                        <p><a href="#" class="lien">Spells</a></p>
                                </ul>

va falloir revoir la copie là... :/
une liste se compose comme ça:

                       <ul>
                                    <li><a href="#" class="lien">Builds</a></li>
                                        <li><a href="#" class="lien">Champions</a></li>
                                        <li><a href="#" class="lien">Spells</a></li>
                                </ul>

19 janv. 2011, 00:03

Ouais mais jvoulait pas avoir de puce (zutt)

19 janv. 2011, 00:05

Taratata!
Pour enlever les puces, on garde la même structure html... (on garde la sémantique)
Et on utilise la propriété css : list-style-type

19 janv. 2011, 00:05

Puis sa change rien a mon probleme moi j'veux juste que mes liens soient centrés ...

Svp aidez-moi

19 janv. 2011, 00:37

Si justement, ça change beaucoup de choses

le code que tu as écrits précédemment est incorrect...
Du coup il se peut que ce soit la cause d'une mauvaise interpretation du html et donc des styles associés....
Pour continuer sur ma lancée, pourquoi as-tu rajouté des <div class="element_menu"> ?
Ils ne servent pas à grand chose, il me semble...

J'hésite à donner tout de suite la solution, sinon tu risques de ne pas faire les modifs nécessaires

M'enfin, à mon avis (il faudrait un exemple en ligne pour être sûr c'est plus pratique...

) il faut que tu regardes du côté des propriétés margin et padding de tes <ul> et <li>...

19 janv. 2011, 04:44

Loool jai trouver le probleme :O Je mettais des padding au <li> mais c'est au <ul> qui fallait je les mettent xD

Merciiii

Add moi msn si tu veux

Demande moi par MP je vais te le dire

Besoin d'aide en CSS

Qui est en ligne