Grille avec espacement

Bonjour,

Je voudrais faire une grille d'objets avec un espace de 20 px entre chaque.

J'ai une div de contenu et dedans des div en float left, margin-right et margin-bottom à 20px.

La grille s'affiche bien mais j'ai une marge à droite aussi à la fin du dernier objet d'une ligne et c'est pas beau. Je voudrais que le dernier objet soit collé au bord de la div de contenu, qui a ses propres marges. Il y en a aussi en bas de la dernière ligne mais ça me gène moins.
Quelqu'un a sûrement déjà résolu ça.

Merci de votre aide.

Salut,

Tu peux tout simplement mettre une classe sur le dernier objet de la ligne, de manière à supprimer les marges à droite et en dessous de ce dernier bloc.

Tu peux éventuellement utiliser la pseudo-classe :last-child seulement cela ne fonctionnera pas sur tous les navigateurs.

Oui bien sûr mais ça ne me convient pas. Les objets sont alimentés dynamiquement et leur nombre par ligne peut varier.

:last-child ne va porter que sur le dernier objet et pas sur tous les derniers objet de chaque ligne non?

Bonjour,
Désolé, mais ta demande manque de précision; par exemple, nous ne connaissons pas les dimensions de ta div de contenu, ni celles des objets ...
Pourrais-tu nous proposer le code que tu as déjà essayé?
Cordialement

En fait, les dimensions importent peu. C'est plus une question d'ordre général. Comment afficher une grille d'objets dont le nombre par lignes est variable avec un espacement fixe entre chaque mais que cet espacement ne se retrouve pas en fin de ligne voire en fin de grille.

Mettons que la div de contenu fasse 760px et que chaque objet fasse 240px.

Si la réponse est d'ajouter une classe ou autre chose spécifiquement au dernier objet de chaque ligne, je sais faire. Ce que je voudrais, c'est justement savoir si c'est possible sans ça ou tout du moins automatiquement en css.
Modifié par stanc (27 May 2011 - 11:14)

Salut,

La réponse arrive tard, mais comme je viens de me poser la même question que stanc...

En fait stanc a raison : on ne peut pas toujours contrôler le design sur le nombre de div affichées. Si l'on utilise un CMS qui affiche des extraits d'articles dans un thème magazine par exemple. Dans ce cas d'école, on ne gère pas le nombre d'articles qui va apparaitre dans la colonne principale.

Je suis allé voir les solutions standard de grilles proposées par 960 Grid System par exemple. En fait tout le monde triche : la div de la colonne principale est suffissament large pour permettre de contenir les div affichées avec leur margin inclus, tout simplement.
Modifié par Olivier C (20 May 2012 - 16:29)

Une autre ressource directement issue d'Alsacréations : La pseudo-classe CSS2 :first-child