28221 sujets

CSS et mise en forme, CSS3

[Résolu] Petit probléme pour centrer une balise <li> !

Bonjours à vous tous programmeurs Smiley smile
Voilà je fais un petit menu à l'intérieur de mes pages en CSS, et je me trouve confronté cette fois si à un probléme avec.... Firefox... Et oui étonnant ! Quoique...

Voici mon code HTML : 
      
<ul class="menupage">
               <li><a href="index.php?pages=xpreg"> Optimisation</a></li>
               <li><a href="index.php?pages=xpconf"> Configuration</a></li>
      </ul>


Mes feuilles CSS :

ul.menupage {
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	margin: 50px 0px;
	padding: 50px 0px;
}

ul.menupage li {
    font-size: 18px;
	font-weight: bold;
	padding-bottom: 60px;
	list-style-type: none;
    
}

ul.menupage li a {
    display: block;
	width: 300px;
	border: 2px solid #757575;
	padding: 10px 0px;
	color: #c4ffff;
	text-decoration: none;
}
ul.menupage li a:hover {
	background-color: #3e3e3e;
	color: #0cf
}


En fait j'ai voulu que le cadre de mes liens, aient une largeur fixe de 300Px; j'ai alors utilise la fonction Display:block... Et la suprise, sous Firefox le tout n'est plus centré depuis que j'ai mis mon display:block... Ca fait une heure que je cherche, et pas moyen de trouver la solution. Sous IE, tout va bien. Donc si vous avez une idée elle est bien venue Smiley cligne

Merci bien
La page en question si ça peut aider : http://extantpc.free.fr/test.php?pages=astucewin
Modifié le 16 Dec 2004 - 15:03
Désolé pour ce coup là, mais je n'arrive pas bien à lire ton code, il y a un peu trop de div à mon avis, il y a aussi un peu beaucoup de css, d'autant plus que tu appelles 3 feuilles de style et que tu mets la structure css dans ta page.

Je te conseillerais d'adopter une structure plus simple avec une régime pour ce qui concerne les class dont beaucoup me semblent superflues, tu gagnerais en simplicité et t'épargnerais bien des soucis de conception.
Un peu de lecture:
Maladies exotiques des CSS ?
XHTML : trop de <div> tue les <div> !
J'appel trois feuilles de style simplement par que j'ai séparé pour une meilleurs facilité de conception. Mais normalement ça doit pas géner. C'est juste un aspect pratique pour moi.


Par contre je ne comprends pas ta remarque :
a écrit :
tu mets la structure css dans ta page.

Tu pourrais être plus explicite ? Merci

Pour les Class, il me semble que ceux que j'utilise me sont utiles... Pour ce qui est des DIV, je sais j'en ai à surprimer, et d'autres à remplacer par d'autres balises...

Mais bon sinon pour l'erreur je pense pas que cela soit du à la conception du site ? Si ?

En fait non je pense pas que l'erreur vienne de là car si on regarde cette page en dehors du site que j'ai fait :
http://extantpc.free.fr/liste.php

Y'a le probléme.
Modifié le 16 Dec 2004 - 00:39
Steuf a écrit :
C'est juste un aspect pratique pour moi.


Sûrement, mais pas très pratique pour celui qui veut analyser une page dans tous ses éléments. Avoir d'une part le code html, d'autre part 3 feuilles de style à part et la structure css dans le code html ne donne pas une vision d'ensemble aisée pour isoler un soucis. Smiley cligne

a écrit :
Par contre je ne comprends pas ta remarque :

tu mets la structure css dans ta page.[code]

C'est vrai que c'est pas très compréhensible de ma part Smiley confused

Je voulais exprimer par le terme structure que par css tu délimites les zones principales de ta page (conteneur, centre, droite etc.). Une fois cette étape réalisée tu ne devrais pas avoir besoin d'autant de class.

Ce long laius pour dire que je n'ai pas une vue d'ensemble suffisante pour isoler le problème en question. Mais l'occasion peut-être de quelques conseils Smiley cligne .

ps: il est préférable de nommer tes id par leur fonction que par la place qu'ils occupent à un instant, si tu veux déplacer une div id=gauche à droite, il va falloir reprendre le code toutes tes pages. Smiley lol
Oui je sui d'accord j'ai certaine choses à revoir, mais voilà, c'est vrai que j'aurais du laisser le probléme de façon isolé et non le donner dans mon site. Donc le probléme isolé tu peux le retrouver ici :
http://extantpc.free.fr/liste.php

Donc si tu as une idée du pourquoi sous Firefox ça marche pas, elle est bienvenue ! Merci
Moi je rajouterai un :

	margin-left:auto;
	margin-right:auto;


dans ta balise "ul.menupage li a" mais il doit exister d'autres solutions.
En même temps j'ai du mal à m'y retrouver dans ta notation.
Ha merci impeccable, a priori j'avais tout essayé sauf ça.... Parfait, sinon pour le code de la page "épuré" que j'ai envoyé, il est quand même on ne peut plus simple ! Non ?
Sujet clos
Aller à