PB alignement de produits

Messagepar azaroth » Mar 11 Sep 2007, 01:11

Bonsoir,

J'essai d'aligner les produits qui figurent dans ma boutique car par défaut, la présentation est disgracieuse et c'est peu dire, voyez vous-même ici :
http://www.resistancia-ug.org/php/distro/products_new.php

Vous remarquerez que les titres, descriptif, boutons de validation et image sont trop bas et pas assez sur la droite.

J'ai tout essayé pour arranger ça mais c'est là que je me rends compte que ceux qui ont inventé le CSS sont des tordus de la pire espèce. Je modifie une valeur et ça m'aligne tout en diagonal, c'est à ne rien y comprendre, c'est illogique.


Je voudrai savoir quelle différence qu'il y a entre 0 0px 0em.

Voilà le code de mon fichier "products_news.css
/* -- products_new.php -- */
div#productsNew h1 {
padding: 0px 0 40px 0 ;
background: transparent url(../../../images/table_background_products_new.gif) no-repeat right;
}

div.productsNewContener { background: #fff; background : transparent url(../images/produits.gif) no-repeat top center; margin:0.5em 1em 0 0; padding:0; }
div.productsNewContener dl { margin:0; padding:0px; }

div.productsNewContener dl dd.productImage{float:left; margin:0; padding:0;}

div.productsNewContener dt { margin:0; padding:0 0 0.5em 0.5em; font: bold 1.3em Georgia,Arial,sans-serif;}

div.productsNewContener div.productBuynow { margin: 0.5em 0 0 0;padding:0; }

div.productsNewContener div.spacer { clear: right; }

Si vous pouvez m'aider, ça serai bien car là, je capitule, j'ai essayé toutes les possibilités possibles et imaginables sauf ce qu'il convient de faire. J'en viens presqu'à me demander si les alignements que je souhaite faire ne sont pas faisables ailleurs.
azaroth
Membre actif
 
Messages: 47
Inscription: Lun 03 Sep 2007, 22:35

Messagepar cymbeline » Mar 11 Sep 2007, 09:47

Bonjour,

Je voudrai savoir quelle différence qu'il y a entre 0 0px 0em.

regarde ici : http://www.commentcamarche.net/css/css-unites.php3#relative

Tous tes éléments sont aussi dans une autre "Boîte" :

<div id="pageContent"><div id="productsNew"> essai de bouger les valeurs de ton #pageContent, il doit être dans stylesheet.css. Par exemple :

Code: Tout sélectionner
#pageContent{
  float:left;
 top: 100px;
 width : 560px;
  margin: 15px 0px 0px 0px;
  padding: 20px 0px 20px 0px;
  /*background-color: #FF99FF;*/
  color: #000000;
 /*border: 1px solid green;*/
}

et utilise dans tes règles css : border: 1px solid green; et d'autres couleurs que green (blue, red, yellow, lime...) pour visualiser tes "boîtes" et débuguer.

++
cymbeline
Membre très actif
 
Messages: 265
Inscription: Mer 06 Sep 2006, 20:01
Localisation: Nevers

Messagepar azaroth » Mar 11 Sep 2007, 12:06

J'ai finalement réussi en modifiant le fichier products_new.css. J'a modifié la ligne :

div.productsNewContener dl dd.productImage{float:left; margin:0 10px; padding:0;}

Finalement, c'était pas si compliqué mais j'aurai bien peiné quand même.
Dernière édition par azaroth le Mar 11 Sep 2007, 12:18, édité 1 fois.
azaroth
Membre actif
 
Messages: 47
Inscription: Lun 03 Sep 2007, 22:35


Retourner vers Design

 


  • Articles en relation
    Réponses
    Vus
    Dernier message

Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 4 invités

cron