problème avec une propriété css "height" [Résolu]

ferhat.adel · 26/02/2011, 11h39

bonjour a tous le monde je suis un débutant dans le développement web
voici un petit code que j'ai fait

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
div
{color:#0C3;
width:100%;
height:100%;
background-color:#C00;
}

la propriété height:100% ne marche pas (j'ai vérifié grace à la couleur du fond elle ne couvre pas tout l’écran pour la largeur sa marche je utilise firefox 3.6
merci

NoSmoking · 26/02/2011, 14h09

Bonjour,
ajoutes ceci dans ta feuille de style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
html, body {
  margin : 0;
  padding : 0;
  height : 100%;
}

ferhat.adel · 26/02/2011, 14h15

bonsoir votre méthode ne marche pas

merci

NoSmoking · 26/02/2011, 14h22

Citation:

Envoyé par ferhat.adel

bonsoir votre méthode ne marche pas
merci

pour test

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Full Screen</title>
<style type="text/css">
html, body {
  margin :0;
  padding : 0;
  height : 100%;
}
div{
  color:#0C3;
  width:100%;
  height:100%;
  background-color:#C00;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

si cela ne fonctionne pas, le problème est ailleurs...

ferhat.adel · 26/02/2011, 14h34

bonsoir merci pour votre réponse mais pourquoi on doit mettre padding et margin égales à zéro

merci

NoSmoking · 26/02/2011, 14h47

Citation:

Envoyé par ferhat.adel

bonsoir merci pour votre réponse mais pourquoi on doit mettre padding et margin égales à zéro

merci

simplement pour mettre sur le même plan d'égalité tous les navigateurs, les valeurs par défaut de ceux ci n'étant pas les mêmes pour ces propriétés.

ferhat.adel · 26/02/2011, 14h49

bonsoir merci mais pk on doit mettre height:100% dans la balise body j'ai remarque que si j’élève ca marche pas

merci

NoSmoking · 26/02/2011, 14h55

Citation:

Envoyé par ferhat.adel

bonsoir merci mais pk on doit mettre height:100% dans la balise body j'ai remarque que si j’élève ca marche pas

merci

pour forcer le body a occuper toute la place disponible, par défaut il prend 100% de la largeur mais n'occupe que la hauteur minimum nécessaire, voila le pourquoi du height:100%

ferhat.adel · 26/02/2011, 15h02

bonsoir merci pour votre réponse
mais pk on doit forcez la balise body à weight:100% puisque j'ai mis 100% à la balise div
je suis vraiment perdu (ya t'il un héritage ou pas des propriété dans la balise <body> vers la balise <div>
mais on mis weight:100% pour la balise <div>
merci

NoSmoking · 26/02/2011, 15h14

quand on met sur un élément une width et/ou une height à 100% cela signifie que cet élément occupe 100% de la largeur, et/ou de la hauteur de son conteneur.
Pour ta DIV son conteneur est le body, donc il faut forcer le body à occuper 100% de la largeur et/ou hauteur de son propre conteneur qui est le html, pour certains navigateurs, ou la fenêtre plus généralement...

26/02/2011, 14h15	#3
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	ca ne marche pas bonsoir votre méthode ne marche pas merci
	00

26/02/2011, 14h34	#5
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	demande d'information bonsoir merci pour votre réponse mais pourquoi on doit mettre padding et margin égales à zéro merci
	00

26/02/2011, 14h49	#7
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	demande d'information bonsoir merci mais pk on doit mettre height:100% dans la balise body j'ai remarque que si j’élève ca marche pas merci
	00

26/02/2011, 15h02	#9
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	remerciment et demande d'information bonsoir merci pour votre réponse mais pk on doit forcez la balise body à weight:100% puisque j'ai mis 100% à la balise div je suis vraiment perdu (ya t'il un héritage ou pas des propriété dans la balise <body> vers la balise <div> mais on mis weight:100% pour la balise <div> merci
	00

26/02/2011, 15h14	#10
NoSmoking Modérateur Inscription : janvier 2011 Messages : 2 932 Détails du profil Informations personnelles : Sexe : Localisation : France, Isère (Rhône Alpes) Informations forums : Inscription : janvier 2011 Messages : 2 932 Points : 4 752 Points : 4 752	quand on met sur un élément une width et/ou une height à 100% cela signifie que cet élément occupe 100% de la largeur, et/ou de la hauteur de son conteneur. Pour ta DIV son conteneur est le body, donc il faut forcer le body à occuper 100% de la largeur et/ou hauteur de son propre conteneur qui est le html, pour certains navigateurs, ou la fenêtre plus généralement...
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email