Se connecter / S'enregistrer
Votre question

Div au dimenssion non attendues

Tags :
  • Html
  • Programmation
Dernière réponse : dans Programmation
10 Mars 2010 14:28:39

Bonjour,

J'explique mon problème : J'ai une DIV contenant une image de 65 px de haut ... La DIv prend un height de 70 alors que la DIv est specifiée avec un margin 0 px et un padding 0 px. Même si visuellement cela n'a aucune réel impact c'a risque tout de même de me poser des problèmes dans l'avancement de mon projet par la suite ... Pourquoi le DIV est à 70 px alors que le contenant est de 65 ... Merci pour vos reponses

Autres pages sur : div dimenssion attendues

10 Mars 2010 15:49:49

Bonjour.

peux tu mettre le code Html généré s'il te plait ?


m
0
l
10 Mars 2010 15:56:37

voici le html :

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html>
  4. <head>
  5. <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  6. <meta name="generator" content="PSPad editor, www.pspad.com">
  7. <link rel="stylesheet" media="all" type="text/css" title="style" href="style_1.css" />
  8. <title></title>
  9. </head>
  10. <body>
  11. <div class="bandeau">
  12. <img src="img/titre.png" alt="El Flamenco Rosa">
  13. </div>
  14. </body>
  15. </html>


Et voila le CSS :

  1. * {
  2. margin:0px;
  3. padding:0px
  4. }
  5.  
  6. body {
  7. text-align:center;
  8. background-image:url(img/fond.jpg);
  9. background-position:center;
  10. background-repeat:repeat-y;
  11. background-color:darkmagenta;
  12. width:1024px;
  13. margin:auto;
  14. padding-top:20px;
  15. }
  16.  
  17. .bandeau {
  18. text-align:center;
  19. width:1024px;
  20. border:none;
  21. margin:auto;
  22. padding:auto;
  23. }


Il doit y avoir une subtilité mais impossible de comprendre grrrr

Merci par avance
m
0
l
10 Mars 2010 16:16:24

essaye

.bandeau {
text-align:center;
width:1024px;
border:none;
margin:0px;
padding:0px;
}

m
0
l
10 Mars 2010 16:51:02

C'est fait mais le résultat est le même ... Visiblement il me prend les 5 px en trop vers le bas, je le vois quand j'affiche la taille des blocs avec firefox et web développer






m
0
l
10 Mars 2010 20:05:23

bonjour

Teste avec line-height: 0px; dans .bandeau

++
m
0
l
15 Mars 2010 13:01:54

le div bandeau pourrait hériter du margin: auto de body qui lui même n'a aucun intêret.
le fait de mettre
* {
margin:0px;
padding:0px
} te permet deja de travailler sans te souciller des margins et paddings à moins que tu n'as une valeur précise à donner
Commence donc par supprimer tes "margin:auto; padding:auto;" si ça ne prend tjr pas fixe la hauteur de ton div bandeau à la hauteur de l'image



" Cordialement El-Waid le Caid"
m
0
l
15 Mars 2010 17:21:14

j'insiste mais line-height: 0px; ça le fait chez moi :-)
dimension de la div OK.
m
0
l
a c 232 L Programmation
15 Mars 2010 23:24:03

Oui le line-height fonctionne.
De plus, il a déjà mis le * { margin:0; padding:0; }
Bref, rien de bien intéressant.
m
0
l
22 Mars 2010 10:49:38

Bonjour,

Merci à tous, en mettant le line-height:0px cela a réglé le problème.
m
0
l
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS