28220 sujets

CSS et mise en forme, CSS3

Bonjour.

J'ai juste une petite question toute simple.

Si j'ai un DIV avec une largeur de 555 pixels, et que je lui mets un margin-left: 5px; est-ce que je dois réduire sa largeur à 550 pixels?
La marge va "remplacer" les 5 pixels manquants dans la largeur ?

merci d'avance.
(je débute en CSS, alors soyez indulgents s'il vous plaît !) Smiley lol
Modifié par j-s (03 Jul 2005 - 20:17)
Il faut bien distinguer marging et padding.

marging : c'est pr faire une marge à l'extérieur de ton objet, c'est-à-dire que tout autre objet sera séparé de ton objet par cette marge.

padding : c'est pr faire une marge à l'intérieur de ton objet, c'est-à-dire que tout objet, texte, image à l'intérieur de ton objet sera situé à une distance du bord suivant cette marge.

Pour plus de détails : http://css.alsacreations.com/Bases-et-indispensables/Comprendre-le-positionnement-des-balises-en-CSS
Modifié par brunocaccio (03 Jul 2005 - 19:53)
oui ça je le savait,

mais supposons que j'aie un DIV conteneur de 760pixels de large, et que dedans, j'en insère un autre avec aussi 760pixels de large (je sais, c'est inutile ^^) mais que je mets à ce dernier une marge gauche de 5 pixels, mon DIV conteneur sera-t-il étiré pour mesurer 765 pixels ? dois-je réduire la taille de mon DIV intérieur à 755 pixels pour que la mesure de ce dernier + la mesure de la marge égalent la mesure du conteneur ???

Merci d'av.
Salut,
Les marges se trouvent a l'exterieur de ton bloc cela signifie que si tu a un bloc de 500px avec une marge de 10px le tout aura une largeur de 520px.

Par contre le padding n'est pas géré de la même maniére sous firefox et IE, sous FF il n'agrandie pas le bloc alors que sous IE il l'agrandi.

Bonne continuation.
Re,
En fait la marge va rétrécir ton div interieur. Ton conteneur gardera sa taille et le div a l'intérieur sera rétrécie de la valeur de la marge.

EDIT: Je vien de faire un test et je me suis rendu compte que si tu donne la largeur au contenu ca le fait déborder en fait et ca na le redimensionne pas du tout. Toutes mes excuses.
Modifié par Vince1415 (03 Jul 2005 - 20:07)
ok alors je ne change pas la taille de mes DIV, quand j'applique des marges, elle se réduit automatiquement ?
Modifié par j-s (03 Jul 2005 - 20:03)
j-s a écrit :
ok alors je vais réduire la taille de mon div pour que sa mesure + celle de ses marges égale celle du conteneur ?


Voila Smiley cligne
j-s a écrit :
oui ça je le savait,

mais supposons que j'aie un DIV conteneur de 760pixels de large, et que dedans, j'en insère un autre avec aussi 760pixels de large (je sais, c'est inutile ^^) mais que je mets à ce dernier une marge gauche de 5 pixels, mon DIV conteneur sera-t-il étiré pour mesurer 765 pixels ? dois-je réduire la taille de mon DIV intérieur à 755 pixels pour que la mesure de ce dernier + la mesure de la marge égalent la mesure du conteneur ???

Merci d'av.


En flux (absence de float et position), ton conteneur ne sera pas étiré. Ton div intérieur sera décalé vers la droite de 5px, et débordera donc à droite de son conteneur. La propriété overflow te permet d'agir sur ce débordement. Sa valeur par défaut est "visible".

Pour aller plus loin, voir justement cette propriété overflow dans CSS2.1

Et petit détail amusant : IE ne respecte pas cette règle, et agrandit le conteneur (width interprété comme min-width par ce navigateur)
Modifié par Laurent Denis (03 Jul 2005 - 20:07)
ok... et les bordures, elles sont placées à l'extérieur ou à l'intérieur de la paroi d'un DIV ?