28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit soucis, je fais mon propre système de grid CSS et j'ai 2 problèmes que je n'arrive pas a corriger. Mon .grid12 qui correspond à ma plus grand largeur ne veut pas se bloquer à 1200px alors que je lui met :

.grid12 { width: 100%; max-width: 1200px; } celui-ci se fiche de mon 1200px ! il continue a s'élargir au delà de 1200px.

et j'ai un autre soucis, je veux espacer mes colonnes avec un espace, donc j'ai mis mes articles dans une autre DIV pour leur insérer un margin .article-margin { margin: 20px; } celui-ci met bien un margin au dessus et sur le côté mais pas entre mes colonnes Smiley eek !

Voici mon exemple : http://infographiste.us/web/index.php

Merci Smiley smile
Modifié par 6l20 (25 Jul 2015 - 20:49)
tu as un défaut de conception dans ta mise en forme.

tes .article-margin contiennent des éléments flottants mais ils ne les englobent pas.

Pour comprendre, fait une recherche sur les éléments flottants , clear et le "contexte de formatage".

C'est assez complexe et déstabilisant pour un débutant, comme il y a foultitude d'article et tutoriel la dessus. Je te conseil d'en lire un ou deux et de faire macérer un peu ou de réviser tes connaissances sur les flottants..

Par exemple donne une couleur de fond. teste.
ajoute une bordure. teste.
ajoute overflow:hidden ou float : left et teste à nouveau.

Tu peut aussi t'inspirer des systèmes qui existe déjà en tentant d’analyser leur logique de mise en forme Smiley smile

Cdt,
re

j'ai corrigé 2 pb pour le moment, le max-width fonctionne maintenant, et la rond orange suit son parent, il me reste les marges entre mes grid à corriger Smiley smile