Avoir la longueur d'une div de la même qu'une
Résolu/Fermé
Sarti
-
7 août 2009 à 02:49
imw Messages postés 233 Date d'inscription vendredi 17 juillet 2009 Statut Membre Dernière intervention 8 septembre 2011 - 8 août 2009 à 09:42
imw Messages postés 233 Date d'inscription vendredi 17 juillet 2009 Statut Membre Dernière intervention 8 septembre 2011 - 8 août 2009 à 09:42
A voir également:
- Avoir la longueur d'une div de la même qu'une
- Div c++ - Télécharger - Langages
- Mesurer longueur avec telephone - Guide
- Moyenne.si.ens #div/0 ✓ - Forum Excel
- Dimension tv 43 pouces longueur et largeur - Forum Ecran
- Ce mot de passe ne répond pas aux critères de longueur, de complexité, de date ou d'historique de la stratégie de mot de passe de votre entreprise. - Forum Windows
4 réponses
imw
Messages postés
233
Date d'inscription
vendredi 17 juillet 2009
Statut
Membre
Dernière intervention
8 septembre 2011
42
7 août 2009 à 09:03
7 août 2009 à 09:03
A priori, tu ne peux pas dire en css que tu veux qu'un div fasse la même dimension qu'un autre ...
La solutions sont :
- soit rajouter un div autour du menu+main, de passer menu et main en float left, et rajouter après le main un <br style='clear: both;' /> qui va forcer le div parent à aller jusqu'au bas du plus grand des 2 autres ... Il te suffit ensuite de mettre le background du menu dans le div parent ...
- sinon, il est possible en javascript de récupérer la taille du div main et de l'appliquer au div menu ...
La solutions sont :
- soit rajouter un div autour du menu+main, de passer menu et main en float left, et rajouter après le main un <br style='clear: both;' /> qui va forcer le div parent à aller jusqu'au bas du plus grand des 2 autres ... Il te suffit ensuite de mettre le background du menu dans le div parent ...
- sinon, il est possible en javascript de récupérer la taille du div main et de l'appliquer au div menu ...
Ok merci ça marche.
Seulement, un problème en soulève un autre... maintenant que j'ai mon menu et mon corps de site qui sont à la même hauteur, j'ai un espace qui s'est créé entre le footer et le duo menu/corps...
Voici les codes:
HTML:
<div id="container">
<div id="menu">
<img src="images/menu.gif">
</div>
<div id="header2">
</div>
<div id="main">
<h1>Bienvenue !</h1>
<p>
essai
</p>
</div>
</div>
<br style='clear: both;' />
<div id="footer">
</div>
CSS:
#container
{
width: 800px;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
margin-bottom: 0px;
}
#menu
{
float: left;
width: 226px;
height: 100%;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
}
#main
{
margin-left: 226px;
padding: 3px;
background-image: url("images/designgite2_04.jpg");
background-repeat: repeat-y;
}
#footer
{
width: 800px;
height: 144px;
background-image: url("images/footer.gif");
background-repeat: no-repeat;
margin-bottom: 0px;
}
Merci !!
Seulement, un problème en soulève un autre... maintenant que j'ai mon menu et mon corps de site qui sont à la même hauteur, j'ai un espace qui s'est créé entre le footer et le duo menu/corps...
Voici les codes:
HTML:
<div id="container">
<div id="menu">
<img src="images/menu.gif">
</div>
<div id="header2">
</div>
<div id="main">
<h1>Bienvenue !</h1>
<p>
essai
</p>
</div>
</div>
<br style='clear: both;' />
<div id="footer">
</div>
CSS:
#container
{
width: 800px;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
margin-bottom: 0px;
}
#menu
{
float: left;
width: 226px;
height: 100%;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
}
#main
{
margin-left: 226px;
padding: 3px;
background-image: url("images/designgite2_04.jpg");
background-repeat: repeat-y;
}
#footer
{
width: 800px;
height: 144px;
background-image: url("images/footer.gif");
background-repeat: no-repeat;
margin-bottom: 0px;
}
Merci !!
Suite aux conseils qu'on m'a donné, j'ai créer une div pour l'ensemble Menu / Corps... et ça marche.
Seulement, un problème en soulève un autre... maintenant que j'ai mon menu et mon corps de site qui sont à la même hauteur, j'ai un espace qui s'est créé entre le footer et le duo menu/corps...
Voici les codes:
HTML:
<div id="container">
<div id="menu">
<img src="images/menu.gif">
</div>
<div id="header2">
</div>
<div id="main">
<h1>Bienvenue !</h1>
<p>
essai
</p>
</div>
</div>
<br style='clear: both;' />
<div id="footer">
</div>
CSS:
#container
{
width: 800px;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
margin-bottom: 0px;
}
#menu
{
float: left;
width: 226px;
height: 100%;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
}
#main
{
margin-left: 226px;
padding: 3px;
background-image: url("images/designgite2_04.jpg");
background-repeat: repeat-y;
}
#footer
{
width: 800px;
height: 144px;
background-image: url("images/footer.gif");
background-repeat: no-repeat;
margin-bottom: 0px;
}
Merci !!
Seulement, un problème en soulève un autre... maintenant que j'ai mon menu et mon corps de site qui sont à la même hauteur, j'ai un espace qui s'est créé entre le footer et le duo menu/corps...
Voici les codes:
HTML:
<div id="container">
<div id="menu">
<img src="images/menu.gif">
</div>
<div id="header2">
</div>
<div id="main">
<h1>Bienvenue !</h1>
<p>
essai
</p>
</div>
</div>
<br style='clear: both;' />
<div id="footer">
</div>
CSS:
#container
{
width: 800px;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
margin-bottom: 0px;
}
#menu
{
float: left;
width: 226px;
height: 100%;
background-image: url("images/menu_.png");
background-repeat: repeat-y;
}
#main
{
margin-left: 226px;
padding: 3px;
background-image: url("images/designgite2_04.jpg");
background-repeat: repeat-y;
}
#footer
{
width: 800px;
height: 144px;
background-image: url("images/footer.gif");
background-repeat: no-repeat;
margin-bottom: 0px;
}
Merci !!
imw
Messages postés
233
Date d'inscription
vendredi 17 juillet 2009
Statut
Membre
Dernière intervention
8 septembre 2011
42
8 août 2009 à 09:42
8 août 2009 à 09:42
met le main en float left; (et enlève la marge gauche) et déplace le br à l'intérieur du container ...
