Aller au contenu

Pour les pros du Css


marvine28

Sujets conseillés

Bonjour à tous, j'ai un petit problème de css, je voudrais mettre a gauche une liste et je ne suis pas capable, elle reste toujours a droite et étire mon design.

Exemple live :cool: : www.lactu.net

Je voudrais centrer les images en bas qui commencent par Sarkozy, de façon que mon design ne soit pas étiré.

Mon code css:

#menu_image{ 
border : none;
margin: 0;
padding:0;
}

#menu_image li{
list-style-type:none;
text-align: center;
padding-left:5;
margin: 0;
padding:0;
}

#menu_image a{
text-decoration:none;
color:#000000;
font-size: 14px;

}

Merci d'avance.

Lien vers le commentaire
Partager sur d’autres sites

Chaque élément HTML a des marges extérieures (margin) et intérieures (padding) définies par défaut, selon le navigateur utilisé, et ses réglages.

Dans ton cas, il suffit de réinitialiser les marges intérieures de l'élément pour que tout rentre dans l'ordre :

#menu_image {
padding: 0;
}

Edit : je vois que tu as posté sensiblement le même code, mais il n'apparait pas sur la version en ligne. Es-tu sûr d'avoir bien uploadé ton nouveau fichier ?

Pour pouvoir travailler sur le design d'un site sans avoir à se préoccuper de ces marges par défaut, il est recommandé de les réinitialiser pour tous les éléments en début de code CSS, de la manière suivante :

* {
margin: 0;
padding: 0;
}

Lien vers le commentaire
Partager sur d’autres sites

Il n'y a pas de définition de l'id menu_image dans ta CSS en ligne, les margins et padding ne sont donc pas initialisées comme te le conseille Captain-Torche...

Je pense que tu as mal uploadé ta CSS modifiée.

Lien vers le commentaire
Partager sur d’autres sites

Salut,

c'est un peu le bronx dans ta css :whistling:

ça marche si tu vires

</style>
<!--[if IE 7]>
<style type="text/css">
.menu li {float:left;}
</style>
<![endif]-->

ces conditions c'est pour le html pas la css ;)

Lien vers le commentaire
Partager sur d’autres sites

Bah merci à tous :thumbsup: j'ai décider d'utiliser la façon facile ce qui donne le même résultat.

<p align="center">

<a href="http://www.lactu.net/blog/france/sarkozy-au-g8/"><img border="0" src="http://www.lactu.net/img/sarko.jpg"></a><br /><br />
<a href="http://www.lactu.net/coupe-du-monde-de-rugby/"><img border="0" src="http://www.lactu.net/img/coupe_du_monde.jpg"></a><br /><br />
<a href="http://www.lactu.net/legislative-2007/"><img border="0" src="http://www.lactu.net/img/legislatives.jpg"></a><br /><br />
<a href="http://www.lactu.net/bande-de-gaza/"><img border="0" src="http://www.lactu.net/img/gaza.jpg"></a><br /><br />
<a href="http://www.lactu.net/formule1/"><img border="0" src="http://www.lactu.net/img/formule1.jpg"></a><br /><br />
<a href="http://www.lactu.net/paris-hilton/"><img border="0" src="http://www.lactu.net/img/paris-hilton.jpg"></a><br /><br />

</p>

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...