28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai fait faire un design, et je rencontre un problème avec les listes à puces...

En fait, j'ai 3 fois le meme code, mais il y a un affichage différent à chaque fois...

La page concernée est: http://voilou.fr/test.php

Comme vous le voyez, les lots dans la première box sont bien aligné, mais dans la seconde et troisième box ca foire un peu...et j'avoue ne pas comprendre d'où vient le problème!

En effet, le code de la box est le meme dans les trois cas, la seule chose qui change sont les éléments <li></li>, récupéré dans la base...

A savoir:

Box 1:

<ul><li>test ve fvece eve</li> 				<li>vevzc dqc csvzczczc</li> 				 </ul>


Box 2:

<ul><li>Un sèche cheveux</li>
<li>Une pince à linge</li>
<li>Des fers à repasser</li>
<li>Des boissons...</li></ul>


Box 3:

<ul><li>Une voiture mazda</li><li>Un camapé</li><li>une chambre à coucher</li></ul>


Je pense que le problème vient du css non? Smiley confus

Le css est présent ici : http://www.voilou.fr/css/style.css

Aidez moi svp Smiley rolleyes
Salut

Remplace
.center_box_bottom .rightbox {
  float: [b]right[/b];
  ...
}
Par
.center_box_bottom .rightbox {
  float: [b]left[/b];
  ...
}
Effectivement cela est déjà beaucoup mieux Smiley smile

J'ai rajouté un padding-left 8px; car du coup les puces étaient trop à gauche... Smiley smile

Par contre, au niveau du texte "lots mis en jeu", lorsqu'il y a peu d'éléments c'est pas centré... est ce possible de centrer au milieu?

Merci encore Smiley ravi
joboy a écrit :
Par contre, au niveau du texte "lots mis en jeu", lorsqu'il y a peu d'éléments c'est pas centré... est ce possible de centrer au milieu?

Avec deux colonnes en display:table-cell, ou à défaut (pour la compatibilité IE6-7) un tableau de mise en page, oui.
ok...mais actuellement si je regarde, il ya :

.center_box_bottom .leftbox{float:left; padding-left:7px; font-size:12px; color:#217BC5;padding-top:50px;}

.center_box_bottom .rightbox{float:left; padding-right:10px; padding-left:8px;}


leftbox pour l'element de gauche, que je souhaite aligner verticlement, et rightbox pour les puces, qui elles sont bien alignés maintenant.

N'existe t il pas un attribut qui permettrait de dire "align-vertical: 50%" ou un truc du genre?

Parce que s'il faut tout refaire sous forme de tableaux.. Smiley sweatdrop ( Smiley fache IE)

Merci
joboy a écrit :
N'existe t il pas un attribut qui permettrait de dire "align-vertical: 50%" ou un truc du genre?


Non, ça n'existe pas.