Positionnement avec CSS
Résolu
Robinito
-
Robinito -
Robinito -
Bonjour,
J'ai déjà créé un site internet, il y a deux ans en utilisant CSS et tout s'est passé sans accroche mais là j'en commence un autre et dès le début, je ne sais pas comment m'en sortir. Après avoir essayé quelques "bidouilles" de positionnement je n'arrive pas à faire quelque chose de très simple ! Je veux simplement aligner 3 éléments menu,content et footer sur la même ligne en réglant leur largeur en % et en jouant sur les marges mais #info se place sur la ligne suivant... Voici mon code :
body
{
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#header
{
width:100%;
}
#menu
{
float:left;
width:19%;
}
#content
{
margin-left:19%;
width:57%;
}
#info
{
width:19%;
margin-left:auto;
}
#footer
{
width:100%;
}
Une idée ? Merci
J'ai déjà créé un site internet, il y a deux ans en utilisant CSS et tout s'est passé sans accroche mais là j'en commence un autre et dès le début, je ne sais pas comment m'en sortir. Après avoir essayé quelques "bidouilles" de positionnement je n'arrive pas à faire quelque chose de très simple ! Je veux simplement aligner 3 éléments menu,content et footer sur la même ligne en réglant leur largeur en % et en jouant sur les marges mais #info se place sur la ligne suivant... Voici mon code :
body
{
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#header
{
width:100%;
}
#menu
{
float:left;
width:19%;
}
#content
{
margin-left:19%;
width:57%;
}
#info
{
width:19%;
margin-left:auto;
}
#footer
{
width:100%;
}
Une idée ? Merci
3 réponses
Essaye avec ceci :
body
{
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#header
{
width:100%;
position: absolute;
margin: auto;
top: 0px;
}
#menu
{
poisition: relative;
float:left;
width:19%;
}
#content
{
position : relative;
float: left;
width:60%;
}
#info
{
position: relative;
float: left;
width:19%;
}
#footer
{
position: relative;
width:100%;
}
body
{
margin:0;
padding:0;
height: 100%;
width: 100%;
}
#header
{
width:100%;
position: absolute;
margin: auto;
top: 0px;
}
#menu
{
poisition: relative;
float:left;
width:19%;
}
#content
{
position : relative;
float: left;
width:60%;
}
#info
{
position: relative;
float: left;
width:19%;
}
#footer
{
position: relative;
width:100%;
}