A voir également:
- [XHTML/CSS] Hauteur des balises <div>
- Div c++ - Télécharger - Langages
- Hauteur de ligne excel 1 cm - Forum Excel
- Dans le document à télécharger, placez les 2 images côte à côte et donnez-leur la même hauteur. marie a gagné un lot à l’un des trois tirages. qu’a-t-elle gagné ? ✓ - Forum Word
- Remplacer #div/0 par vide ✓ - Forum Excel
- Enlever le soulignement d'un lien css - Astuces et Solutions
13 réponses
Bonsoir tout le monde je viens à l'instant de trouver la réponse à votre problème pour mettre une hauteur en pourcentage à une div et je vous dirais pas c'est quoi mouahahaha...je plaisante me haissais pas tout de suite rooooh.
Bon voila mon code HTML:
<div id="wrapper"></div>
Code CSS:
html{
height: 100%;
}
body{
height: 100%;
margin: 0;
padding: 0;
}
#wrapper {
width: 100px;
height: 100%;
background-color: #03125F;
margin: auto;
}
Comme vous pouvez le constater il faut remonter jusqu'à la balise HTML et lui assigner une hauteur en pourcentage de 100% comme sur le body,ensuite vous pouvez mettre la hauteur que vous voulez à votre div.
Bonne soirée, il y a mon adresse si vous voulez. younass95@hotmail.com
Bon voila mon code HTML:
<div id="wrapper"></div>
Code CSS:
html{
height: 100%;
}
body{
height: 100%;
margin: 0;
padding: 0;
}
#wrapper {
width: 100px;
height: 100%;
background-color: #03125F;
margin: auto;
}
Comme vous pouvez le constater il faut remonter jusqu'à la balise HTML et lui assigner une hauteur en pourcentage de 100% comme sur le body,ensuite vous pouvez mettre la hauteur que vous voulez à votre div.
Bonne soirée, il y a mon adresse si vous voulez. younass95@hotmail.com
Un message un peu en retard...
Mais pour ceux qui ont le même souci voilà un post qui apporte une réponse:
En gros ce que dit l'article en plus de vos post c'est que la déclaration xml ou xhtml y est pour quelque chose...
Je vous laisse méditer.
JU
Mais pour ceux qui ont le même souci voilà un post qui apporte une réponse:
<a href="https://www.alsacreations.com/actu/lire/92-vous-avez-dit-height100.html">Vous avez dit height=100%</a>
En gros ce que dit l'article en plus de vos post c'est que la déclaration xml ou xhtml y est pour quelque chose...
Je vous laisse méditer.
JU
Salut,
Tu peux essayer avec postion: absolute, puis top et bottom dans un div.
Ce div il faut lui mettre un id et pas un class, comme ça tu peux le
retrouver avec du javascript.
Pour les navigateurs respectant le W3C, tu peux même essayer avec
position: fixed => le cadre ne se déplace plus avec la page
Attention, ça fontionne pas avec IE le fixed, il faut jouer avec
javascript sur l'évement scroll du body pour repositionner le cadre
à chaque déplacement, ça fait scintiller mais la fonctionnalité est là...
A+, Crabs
Tu peux essayer avec postion: absolute, puis top et bottom dans un div.
Ce div il faut lui mettre un id et pas un class, comme ça tu peux le
retrouver avec du javascript.
Pour les navigateurs respectant le W3C, tu peux même essayer avec
position: fixed => le cadre ne se déplace plus avec la page
Attention, ça fontionne pas avec IE le fixed, il faut jouer avec
javascript sur l'évement scroll du body pour repositionner le cadre
à chaque déplacement, ça fait scintiller mais la fonctionnalité est là...
A+, Crabs
Utilise document.body.clientHeight, en javascript, et document.body.clientWidth.
En ce qui me concerne, je suis confronté à un problème similaire, je voudrais obtenir la hauteur maximale de la zone contenu (celle de la fenêtre quand elle est maximisée) sans avoir à redimensionner la fenêtre. Je pourrais le calculer facilement si je trouvais une propriété qui donne la hauteur totale de la fenêtre
exemple avec window.height :
hauteurmax = parseInt(document.body.clientHeight) / parseInt(window.height) * parseInt(screen.availHeight);
En ce qui me concerne, je suis confronté à un problème similaire, je voudrais obtenir la hauteur maximale de la zone contenu (celle de la fenêtre quand elle est maximisée) sans avoir à redimensionner la fenêtre. Je pourrais le calculer facilement si je trouvais une propriété qui donne la hauteur totale de la fenêtre
exemple avec window.height :
hauteurmax = parseInt(document.body.clientHeight) / parseInt(window.height) * parseInt(screen.availHeight);
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Tiens nu vieux sujet. ^^
Je vais quand même ajouter ma pierre.
Déjà les blocs prennent toute la place qu'ils peuvent par defaut ( =100%).
Ensuite, bien sur que si les bloc acceptent les pourcentages. Seulement il faut savoir que le pourcentage se calcule sur la taille du bloc parent. Ainsi il faut qu'il ai une taille (enfin de mon côté ça n'a jamais marché si la taille du parent n'était pas spécifié, sauf en pourcentage).
Voilà. ^^
Je vais quand même ajouter ma pierre.
Déjà les blocs prennent toute la place qu'ils peuvent par defaut ( =100%).
Ensuite, bien sur que si les bloc acceptent les pourcentages. Seulement il faut savoir que le pourcentage se calcule sur la taille du bloc parent. Ainsi il faut qu'il ai une taille (enfin de mon côté ça n'a jamais marché si la taille du parent n'était pas spécifié, sauf en pourcentage).
Voilà. ^^
Bonjour,
En fait ce problème n'a pas de solution.
Il faut s'y prendre autrement et donner l'impression que les blocs ont la même hauteur.
Ça peut se faire avec une image d'arrière-plan dans le bloc le plus grand qui contient les autres
pompage
alistapart (en)
--
En fait ce problème n'a pas de solution.
Il faut s'y prendre autrement et donner l'impression que les blocs ont la même hauteur.
Ça peut se faire avec une image d'arrière-plan dans le bloc le plus grand qui contient les autres
pompage
alistapart (en)
--
Le probleme de cette solution c'est que firefox ne comprends pas que la <div> parent a une hauteur variable ... j'essaie de me pencher dessus mais je ne trouve pas de solution : help !
salut,
tu ne trouveras sans doute pas mieux mieux que les fausses colonnes conseillées par Gihef en <4>.
tu ne trouveras sans doute pas mieux mieux que les fausses colonnes conseillées par Gihef en <4>.
Je n'ai pas vraiment de solution mais moi j'utilise des marges.
Par exemple pr un div d'environ 85%, étant donné que les largeurs de fenêtres ne varient pas énormément, je mets une marge de 150 px à gauche et la même à droite.
Ululo
Par exemple pr un div d'environ 85%, étant donné que les largeurs de fenêtres ne varient pas énormément, je mets une marge de 150 px à gauche et la même à droite.
Ululo
C'est pas encore possible en CSS2.
Quand tu attribus en CSS un width ou un height, ils s'appliquent sur le contenu interne. La division est extensible en hauteur par defaut.
Toute fois, tu peux essayer quelque chose qui se raprochera pas mal de se que tu veux. Il s'agit bien de mettre un height: 100%;, mais il faut ainsi y rajouter un margin: auto; afin que la specification soit prise en compte par rapport au body exterieur.
Donc ça donnerait:
.taClasse {
height: 100%;
margin: auto;
}
Je pense que ceci marchera si toute fois tu as bien coder l'interface exterieur.
Quand tu attribus en CSS un width ou un height, ils s'appliquent sur le contenu interne. La division est extensible en hauteur par defaut.
Toute fois, tu peux essayer quelque chose qui se raprochera pas mal de se que tu veux. Il s'agit bien de mettre un height: 100%;, mais il faut ainsi y rajouter un margin: auto; afin que la specification soit prise en compte par rapport au body exterieur.
Donc ça donnerait:
.taClasse {
height: 100%;
margin: auto;
}
Je pense que ceci marchera si toute fois tu as bien coder l'interface exterieur.
Salut,
j'espéres pas répondre à côté mais:
Pourquoi pas utiliser un un <table> plutot? ça permet de créer une vrai colonne, et c'est plus simple que de devoir modifier le positionnement des div avec des float ou en absolute voire faire des calculs en js.
j'espéres pas répondre à côté mais:
Pourquoi pas utiliser un un <table> plutot? ça permet de créer une vrai colonne, et c'est plus simple que de devoir modifier le positionnement des div avec des float ou en absolute voire faire des calculs en js.
<table style="width="100%; height:100%;" > <tr> <td> Colonne de 100% a gauche </td> <td> Le reste du contenu de la page </td> </tr> </table>
Bonjour
je viens de lire ton post sur le forum
et j'aimerais que tu me file un coup de main
je cherche comment faire pour introduire un scroll bar sur la droite du contenu de mon site de sorte que le header, le footer et les menu ne bouge pas. au fait mon site est fait avec un noyau joomla
please c urgent. merci d'avance...www.agimexgates.com
je viens de lire ton post sur le forum
et j'aimerais que tu me file un coup de main
je cherche comment faire pour introduire un scroll bar sur la droite du contenu de mon site de sorte que le header, le footer et les menu ne bouge pas. au fait mon site est fait avec un noyau joomla
please c urgent. merci d'avance...www.agimexgates.com
salut,
ouvre un fil de discussion et présente ton problème.
tu peux commencer par corriger les erreurs de validité.
et soit dit en passant, pour un site professionnel tu ferais mieux de faire appel à un professionnel.
ouvre un fil de discussion et présente ton problème.
tu peux commencer par corriger les erreurs de validité.
et soit dit en passant, pour un site professionnel tu ferais mieux de faire appel à un professionnel.
Bonsoir
J'ai un petit soucis avec le cadre de ma page web : http://lifebooster.free.fr/ecouter_de_la_musique.html
On voit bien que les <div> utilisées pour les bords latéraux ne s'adaptent pas à la taille du <body>.
Voici le code CSS associé :
html
{
height: 100%;
width : 100%;
}
body
{
height: 100%;
width : 100%;
margin: 0;
padding: 0;
}
#leftcenter
{
height : 100% ;
width : 32px ;
background-image : url(pics/cadre/leftcenter.gif);
background-repeat : repeat-y ;
float : left;
}
#rightcenter
{
height : 100% ;
width : 40px ;
background-image : url(pics/cadre/rightcenter.gif);
background-repeat : repeat-y ;
float : right;
}
Merci de votre aide :)
J'ai un petit soucis avec le cadre de ma page web : http://lifebooster.free.fr/ecouter_de_la_musique.html
On voit bien que les <div> utilisées pour les bords latéraux ne s'adaptent pas à la taille du <body>.
Voici le code CSS associé :
html
{
height: 100%;
width : 100%;
}
body
{
height: 100%;
width : 100%;
margin: 0;
padding: 0;
}
#leftcenter
{
height : 100% ;
width : 32px ;
background-image : url(pics/cadre/leftcenter.gif);
background-repeat : repeat-y ;
float : left;
}
#rightcenter
{
height : 100% ;
width : 40px ;
background-image : url(pics/cadre/rightcenter.gif);
background-repeat : repeat-y ;
float : right;
}
Merci de votre aide :)
Déjà "height=100%" n'est pas correct je crois, ça donne 100% de la largeur de la page en hauteur si je ne me trompe.
Ensuite ton lien n'est pas valide, et à partir de la base du site (lifebooster.free.fr) je n'ai pas retrouvé la page.
Mais en tous cas moi je n'aurai pas organisé ça comme ça, surtout qu'on a pas le CSS de ta div centrale là.
Ensuite ton lien n'est pas valide, et à partir de la base du site (lifebooster.free.fr) je n'ai pas retrouvé la page.
Mais en tous cas moi je n'aurai pas organisé ça comme ça, surtout qu'on a pas le CSS de ta div centrale là.
merci capoeiradance!!!! pile poil ce que je cherchais ^^
@+