La Communauté Webmaster  forum rss


  Forum-webmaster
  Technique - programmation
  HTML / CSS / XHTML
(Modérateurs: Shain, Netah, Lilian, lauryv, ToToMaStEr)
  CSS: padding
« Précédent Suivant »
Pages: [1] Descendre
Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
  Auteur  Sujet: CSS: padding  (Lu 984 fois)
CSS: padding
« sur: le 07-12-2009 a 10:43:17 »
davbo
Membre récent
*

Hors-Ligne

Messages: 2





Voir le Profil
Répondre avec citation

Bonjour

j'ai un souci avec le padding CSS. Du moins je remarque que FireFox et IE l'interprete differement:

je defini une zone avec une largeur donnee (340px): si j'ajoute un padding de 10px, ma zone fait finalement 350 pix dans IE6 mais reste bien a 340px dans FireFox. Est-ce normal ?

Voici le code CSS:

#section1{
  background-color: #858585;
  height: 180px;
  width: 340px;
  margin: 20px;
  padding: 10px;
  border: 1px dotted white;
}


#section2{
  background-color: #858585;
  height: 180px;
  width: 340px;
  margin: 20px;
  padding: 0px;
  border: 1px dotted white;
}


et le HTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>css</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="t.css" rel="stylesheet" type="text/css" />

</head>

<body>

          <div id="section1">
          section 1
          </div>

          <div id="section2">
          section 2
          </div>
     

</body>

Merci pour votre aide !
DavBO

Rapporter au modérateur  

Re:CSS: padding
« Répondre #1 sur: le 07-12-2009 a 10:53:57 »
davbo
Membre récent
*

Hors-Ligne

Messages: 2





Voir le Profil
Répondre avec citation

Non c'est l'inverse !

IE me conserve bien une taille de zone telle que declaree (par width) alors que sous FireFox, la taille de la zone fait width + padding..

DavBo

Rapporter au modérateur  
Re:CSS: padding
« Répondre #2 sur: le 07-12-2009 a 22:36:22 »
sebinfo
Membre récent
*

Hors-Ligne

Messages: 12





Voir le Profil    WWW
Répondre avec citation

Bonjour, le padding correspond a l'espace entre le contenu d'une boite et les bords de la boite.
La taille de la boite augmente d'autant, c'est tout à fait normal. Concernant les différences entre Firefox et IE, c'est un vieux débat...

Ce que l'on peut dire, c'est qu'à l'heure actuelle, c'est Firefox qui suit le mieux les recommandations du W3C.

Voir cette discussion :
http://www.alsacreations.com/article/lire/537-Mon-site-valide-en-XHTML-Strict-n-est-pas-compatible-partout.html

Rapporter au modérateur  
Re:CSS: padding
« Répondre #3 sur: le 10-12-2009 a 10:52:05 »
MarvinLeRouge
Superactif
****

Hors-Ligne

Messages: 584





Voir le Profil    WWW
Répondre avec citation

Salut,

Si tu déclares correctement ton doctype, ce point est pris en compte de la même façon par IE6 et les autres navigateurs.
N.B. : Sauf cas particulier, ne te base pas sur un quelconque comportement IE6, il est en train de mourir dans les stats.

Rapporter au modérateur  

Développeur web / Création de site internet
jean@ceugniet.com
Jean Ceugniet, Développement web
SIRET : 523 611 044 00018
Re:CSS: padding
« Répondre #4 sur: le 17-12-2009 a 17:38:14 »
enath
Membre récent
*

Hors-Ligne

Messages: 8





Voir le Profil    WWW
Répondre avec citation

En général dans ce genre de cas, pour éviter tout problème dès le départ, je privilégie le margin et essaye d'utiliser padding le moins possible.

Plutôt que de donner un padding à ton élément "boite", donne un margin à l'élément contenu dans ta "boite".

Rapporter au modérateur  

www.studiographie.fr
contact@studiographie.fr
Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
Pages: [1] Monter
« Précédent Suivant »
Sauter à: 

Votre statut : Invité
Vous devez être membre pour participer.
 
 
Let’s Encrypt : le certificat SSL gratuit
Tester votre site internet sur différents navigateurs
[WordPress] Des problèmes avec l’administration ?
Rappel : Mettez à jour vos CMS et vos sites E-commerce
Le .fr fête ses 25 années d’existence !
Mesurer votre audience en temps réel avec BubbleStat
Porter réclamation contre Google Panda ?
Zlio n’est plus …
 
 
 
 
 

Copyright (c) Devclic 2002 - 2026 - Tous droits réservés

creation site internet strasbourg