18041 sujets

Questions générales et questions de débutants

[Résolu] Marge verticale - Comment la laisser fixe

Bonjour

Ma page de tests

L'en-tête comprend du lecteur à la fin des infos CNIL.
Les autres pages n'auront pas le lecteur et si je l'enlève la bannière flash remonte alors que j'aimerai que la marge reste la même.
Malgré vos tutos et mes multiples tests, je suis perdu, elle remonte toujours.

Merci de m'aider.

Code HTML
<body>
<div id="conteneur">
<div id="en_tete">
<div id="lecteur">
<div class="wmp_media">
<object type="audio/x-mid" data="liens/lou.mid" width="200" height="20">
  <param name="src" value="liens/lou.mid" />
  <param name="autoplay" value="false" />
  <param name="autoStart" value="0" />
  alt : <a href="liens/lou.mid">uss_alabama.mid</a>
</object></div></div><br />
<div id="banniere">
<div class="banniere_flash">
  <object type="application/x-shockwave-flash" data="liens/tmpl105_34443a804e57fb.swf" width="468" height="60">
    <param name="wmode" value="Transparent" />
    <param name="movie" value="liens/tmpl105_34443a804e57fb.swf" />
    <param name="quality" value="high" />
    <param name="menu" value="false" />
  </object></div></div><br />
<h1>A.N.V.V.E.N.</h1>
<h3>Association Nationale Victimes Essais Nucléaires</h3><br />
<h5>Association loi 1er juillet 1901 déclarée sous-préfecture de Brest, n°1108 du 19 nov 2003.<br />
Récépissé de déclaration n° 762961, délivré en application de l'article 16 de la loi du 6 janvier 1978 de la C.N.I.L. relative à l'informatique, aux fichiers et aux lettres.</h5>
</div>


Code CSS
body
{
   margin:10px 0;
   padding: 0;
   text-align:center;
   background-image:url(liens/fond.jpg);
}
#conteneur
{
   width:900px;
   text-align:left;
   border:#9EC39E 2px solid;
   margin: 0 auto;
   background-image:url(liens/630B1604.jpg);
}
#en_tete
{
height:330px;
}
#lecteur
.wmp_media
{
   text-align:left;
   margin-top:10px;
}
#banniere
.banniere_flash
{
   text-align:center;
}
h1 /*Titre ANVVEN*/
{
    text-align:center;
	text-transform:uppercase;
	font-style:normal;
	font-size:52px;
	color:#804000;
	font-family:"Arial", Helvetica, sans-serif;
}
h3 /*Sous_titre ANVVEN*/
{
    text-align:center;
	text-decoration:underline;
}
h5 /*infos CNIL*/
{
   font-size:14px;
   font-style:normal;
   font-weight:normal;
   margin-left:7px;
}

Modifié par Auguste (24 Apr 2008 - 14:52)
Bonjour Smiley smile

L'idée qui vient de suite à l'esprit : positionner absolument ta <div class="wmp_media"> et fixer un margin-top à <div class="banniere_flash">

Pour cela :

#entete {
position:relative; }

#lecteur .wmp_media {
position:absolute;
top:0;
left:0; }

#banniere .banniere_flash {
margin-top:...px; }


Sinon tu as quelques balises inutiles : #lecteur et #banniere (ou .wmp_media et .banniere_flash, ça dépend comment on voit les choses). Essaye de fusionner tes balises (et les CSS) pour alléger ton document...
Modifié par BeliG (24 Apr 2008 - 14:25)
Bonjour

Merci beaucoup, c'est bon.
Et pourtant j'en ai fait des tests avec les positions absolues et fixes (non non c'est pas le kama_sutra Smiley cligne Smiley confused ) et les "margin-top" sur les deux (lecteur et bannière). J'ai tourné autour pendant 2h mais trop axé sur la bannière.

Oui mon code est surchargé mais j'ai laissé le minimum ajouté après avoir supprimé mes tests.

Merci encore et Bonne journée !
Auguste a écrit :
non non c'est pas le kama_sutra Smiley cligne Smiley confused

Auguste... Smiley lol Smiley cligne

Un petit [Résolu] dans le titre pour faire plaisir ?
Sujet clos
Aller à