Supp marge externe d'1 DIV dans 1 body [HTML]
Résolu
letsfire_89
Messages postés
308
Statut
Membre
-
letsfire_89 Messages postés 308 Statut Membre -
letsfire_89 Messages postés 308 Statut Membre -
Bonsoir,
Je suis coincé sur un Tp:
je n'arrive pas à supprimer une toute petite marge entre le body et ma div id="corps"!
Voici le html:
et voici le css:
Quelqu'un pourrait-il m'aider s'il vous plait?
Merci!
Je suis coincé sur un Tp:
je n'arrive pas à supprimer une toute petite marge entre le body et ma div id="corps"!
Voici le html:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>TP6-ex2_2</title>
<link rel="stylesheet" media="screen" type="text/css" title="feuille1" href="ex2_2.css"/>
</head>
<body>
<div id="corps">
<div id="case1">
couleur de fond: bleu
</div>
<div id="case2">
couleur de fond: vert
</div>
<div id="case3">
couleur de fond: blanc
</div>
<div id="case4">
couleur de fond: jaune
</div>
couleur de fond: rouge
</div>
<p>
<a href="http://validator.w3.org/check?uri=referer">
<img src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Strict" height="31" width="88"/>
</a>
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
alt="CSS Valide !"/>
</a>
</p>
</body>
</html>
et voici le css:
body{background-color: black; padding-top: 0%;}
div{
text-align: center;
}
#corps{
margin-top: 0%;
position: relative;
top: 0%;
height: 400px;
line-height: 400px;
background-color: red;
}
#case1{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 0%;
left: 0%;
background-color: blue;
}
#case2{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 0%;
right: 0%;
background-color: green;
}
#case3{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 370px;
left: 0%;
background-color: white;
}
#case4{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 370px;
right: 0%;
background-color: yellow;
}
Quelqu'un pourrait-il m'aider s'il vous plait?
Merci!
A voir également:
- Supp marge externe d'1 DIV dans 1 body [HTML]
- Chkdsk disque dur externe - Guide
- Editeur html - Télécharger - HTML
- Html br ✓ - Forum Webmastering
- Ram externe - Forum Matériel & Système
- Balise </br> - Forum HTML
6 réponses
Si tu met un div dans le body et que tu le place en relative, il reste une marge autour.
Essai en absolute. Le bloc sera directement placé par rapport au bord de la fenêtre du navigateur.
J'ai déjà fait ce constat.
Essai en absolute. Le bloc sera directement placé par rapport au bord de la fenêtre du navigateur.
J'ai déjà fait ce constat.
Ah merci! Je n'avais pas vu que j'avais laissé ma div id="corps" en relative!
Voici mon nouveau css corrigé:
top: 0px;
left: 0px;
right: 0px;
Un nouveau problème est apparu: les icônes du W3C en bas de ma page ne s'affichent plus!
Qu'est ce qu'il se passe?
Voici mon nouveau css corrigé:
div{
text-align: center;
}
#corps{
position: absolute;
top: 0px;
left: 0px;
right: 0px;
height: 400px;
line-height: 400px;
background-color: red;
}
#case1{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 1px;
left: 1px;
background-color: blue;
}
#case2{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 1px;
right: 1px;
background-color: green;
}
#case3{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 369px;
left: 1px;
background-color: white;
}
#case4{
height: 30px;
width: 160px;
line-height: 30px;
position: absolute;
top: 369px;
right: 1px;
background-color: yellow;
}
Un nouveau problème est apparu: les icônes du W3C en bas de ma page ne s'affichent plus!
Qu'est ce qu'il se passe?
En effet.
Ca veut dire que tout ce qui suit ma div id="corps" doit être positionné de façon absolue pour éviter d'être engloutie par cette dernière?
Ca veut dire que tout ce qui suit ma div id="corps" doit être positionné de façon absolue pour éviter d'être engloutie par cette dernière?
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Si la hauteur du div corps est variable en hauteur, tu ne pourra pas placer les autres éléments suivant ce div.
Un placement en relative tiens compte des autres éléments pour la placement. Un placement en absolute n'en tiens plus compte.
Exemple:
Supposons que sur une page a ton div corps soit à 500px en hauteur. Tu vas donc placer l'élément du dessous à au moins 500px du haut de la page.
Si sur la page b, le div corp se retrouve à 600px, l'élément du dessous se retrouvera masqué.
La solution:
Une solution simple est de tout placer dans un div container qui sert à placer les éléments dans la page.
C'est celui-ci que tu va éventuellement centrer dans la page et que tu placera en absolute. Tout le reste viendra se placer à l'intérieur en relative.
Un placement en relative tiens compte des autres éléments pour la placement. Un placement en absolute n'en tiens plus compte.
Exemple:
Supposons que sur une page a ton div corps soit à 500px en hauteur. Tu vas donc placer l'élément du dessous à au moins 500px du haut de la page.
Si sur la page b, le div corp se retrouve à 600px, l'élément du dessous se retrouvera masqué.
La solution:
Une solution simple est de tout placer dans un div container qui sert à placer les éléments dans la page.
C'est celui-ci que tu va éventuellement centrer dans la page et que tu placera en absolute. Tout le reste viendra se placer à l'intérieur en relative.
