Positionner les elements de ma page
maria
-
maria -
maria -
Bonjour, j'ai un probleme pour positionner les élements de ma page.je voudrai afficher le menu à gauche et à droite du texte et un formulaire. le menu doit être décalé un peu à l'interieur. quand j'arrive à positionner comme je veux sur dreamweaver, à l'execution sur web local, j'ai une autre presentation. voici mon code html
mon css
<div id="cadremenu">
menu
</div>
<div id="cadre">
<h4>LA GESTION ADMINISTRATIVE </h4>
texte
</div>
<form id="monForm" method="post" action="inserrer-contact.php">
<p>
<label> Societe: </label>
<input type="text" name="societe" />
</p>
<p>
<label> Nom </label>
<input type="text" name="nom" />
</p>
<p>
<label> Prenom </label>
<input type="text" name="prenom" id="textfield3" />
</p>
<p>
<input type="submit" name="button" value="Envoyer" />
</p>
</form>
mon css
#cadre
{
width: 507px;
margin:620px 500px 600px 700px;
position:absolute;
border:none;
height: 186px;
left: -23px;
top: -308px;
}
#cadremenu
{
width: 311px;
margin:430px 0px 0px 740px;
position:absolute;
border:none;
height: 619px;
left: -408px;
top: -68px;
}
body
{
margin:0px 0px 0px 0px;
padding:0px;
background-image:url(../imgs/accueil.jpg);
background-repeat:no-repeat;
background-position:50%;
background-color:#003366;
}
#monForm
{
width: 50%;
margin:500px 0px 0px 700px;
}
/*formulaire-----------------------
A voir également:
- Positionner les elements de ma page
- Impossible de supprimer une page word - Guide
- Photoshop elements gratuit - Télécharger - Retouche d'image
- Faire de google ma page d'accueil - Guide
- Page accueil iphone - Guide
- Numéro de page word - Guide
3 réponses
maria
oui, le css je ne comprend pas grand chose. c'est sur le net que j'ai pris ce que j'ai mis là. et ce ne fais pas ce que je veux
je connais pas le cahier des charges de ton projet, voici ce que tu souhaite , je pense . beaucoup de modifications seront à faire dès que tu progressera dans le projet
<style>
body
{
background-image:url(../imgs/accueil.jpg);
background-repeat:no-repeat;
background-position:50%;
background-color:#003366;
}
#conteneur
{
width: 818px;
border:none;
height: 300px;
}
#menu{
width: 507px;
border:none;
height: 186px;
float: left;
}
#cadre{
width: 311px;
float: left;
border:none;
height: auto;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="menu">
menu
</div>
<div id="cadre">
<h4>LA GESTION ADMINISTRATIVE </h4>
texte
<form id="monForm" method="post" action="inserrer-contact.php">
<p>
<label> Societe: </label>
<input type="text" name="societe" />
</p>
<p>
<label> Nom </label>
<input type="text" name="nom" />
</p>
<p>
<label> Prenom </label>
<input type="text" name="prenom" id="textfield3" />
</p>
<p>
<input type="submit" name="button" value="Envoyer" />
</p>
</form>
</div>
</div>
<style>
body
{
background-image:url(../imgs/accueil.jpg);
background-repeat:no-repeat;
background-position:50%;
background-color:#003366;
}
#conteneur
{
width: 818px;
border:none;
height: 300px;
}
#menu{
width: 507px;
border:none;
height: 186px;
float: left;
}
#cadre{
width: 311px;
float: left;
border:none;
height: auto;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="menu">
menu
</div>
<div id="cadre">
<h4>LA GESTION ADMINISTRATIVE </h4>
texte
<form id="monForm" method="post" action="inserrer-contact.php">
<p>
<label> Societe: </label>
<input type="text" name="societe" />
</p>
<p>
<label> Nom </label>
<input type="text" name="nom" />
</p>
<p>
<label> Prenom </label>
<input type="text" name="prenom" id="textfield3" />
</p>
<p>
<input type="submit" name="button" value="Envoyer" />
</p>
</form>
</div>
</div>
