Sujet Précédent Sujet Suivant

Creer une page avec un cadre fixe en bas

Résolu/Fermé
bibibengo Messages postés 18 Date d'inscription mardi 5 juin 2007 Statut Membre Dernière intervention 11 juillet 2011 - 11 juil. 2011 à 14:19
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 - 11 juil. 2011 à 15:49
Bonjour,
Je veux créer une page d'accueil comportant un cadre (pseudo-frame) au bas de la page qui reste fixe lors du defilement.
Pour cela j'ai crée un div :

Voici le CSS que j'a crée:
#conteneur{
position:absolute;
width:900px;
height:600px;
overflow:inherit;
margin:auto;
margin-left:15px;
margin-right:15px;
top:0px;
left:0px;
}
#haut{
position:absolute;
width:900px;
height:600px;
top:0px;
left:0px;
margin:auto;
overflow:visible;
margin-left:10px;
margin-right:10px;
}
#banniere{
position:fixed;
width:1000px;
height:50px;
top:580px;
margin:auto;
margin-left:15px;
margin-right:10px;
overflow:auto;
text-align:center;
background-color:#FFDFFF;
}
#content_banniere{
position:absolute;
width:950px;
height:45px;
top:580px;
margin:auto;
margin-left:15px;
margin-right:10px;
}
#close_banniere{
position:absolute;
width:50px;
height:50px;
top:580px;
left:900px;
text-align:center;
font:Arial, Helvetica, sans-serif;
color:#FFF;
font-weight:bold;
font-size:13px;
margin-left:15px;
margin-right:10px;
text-align:center;
background-color:#009900;
}
Voici le code de la page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<link href="/relook_ok/css/blocs.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="conteneur">
<div id="haut">Haut</div>
<div id="banniere">
<div id="content_banniere">Banniere</div> //Doit contenir une animation flash
<div id="close_banniere">x</div>//Doit permettre de fermer le calque Banniere
</div>
</div>
</body>
</html>

Mon probleme c'est que le calque qbanniere et son contenu reste invisible à l'exécution.
Si quelqu'un à l'expérience de ce genre de page qu'il me donne un coup de main.

A voir également:

3 réponses

Réponse 1 / 3
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
11 juil. 2011 à 14:43
Bonjour,

quelque chose comme ca ? 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<link href="/relook_ok/css/blocs.css" rel="stylesheet" type="text/css" />
<style>
#conteneur{
position:absolute;
width:900px;
height:600px;
overflow:inherit;
margin:auto;
top:0px;
left:0px;
}
#haut{
position:absolute;
width:900px;
height:600px;
top:0px;
left:0px;
margin:auto;
overflow:visible;
margin-left:10px;
margin-right:10px;
}
#banniere{
position:fixed;
width:100%;
height:50px;
bottom:0;
text-align:center;
background-color:#FFDFFF;
}
#content_banniere{
position:absolute;
width:100%;
height:45px;
}
#close_banniere{
position:absolute;
text-align:center;
font:Arial, Helvetica, sans-serif;
color:#FFF;
font-weight:bold;
font-size:13px;
text-align:center;
background-color:#009900;
right :10px;
bottom: 35px;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="haut">Haut</div>

</div>
<div id="banniere">
<div id="content_banniere">Banniere</div> 
<span id="close_banniere">x</span>
</div>
</body>
</html>


Adns
0
Réponse 2 / 3
bibibengo Messages postés 18 Date d'inscription mardi 5 juin 2007 Statut Membre Dernière intervention 11 juillet 2011 4
11 juil. 2011 à 14:51
OK, je vais essayer pour voir
0
Réponse 3 / 3
bibibengo Messages postés 18 Date d'inscription mardi 5 juin 2007 Statut Membre Dernière intervention 11 juillet 2011 4
11 juil. 2011 à 15:07
Merci bcp, c'est ce que je voulais. je crois que mes calques se chevauchaient si j'ai bien compris.
Il reste le script pour fermer le calque.
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
11 juil. 2011 à 15:09
Les calques se chevauchais et j'ai retouché un peu le CSS
Ce que tu devrait aussi faire pour adapter ton site a chaque résolution d'écran en utilisant des % plutôt que des valeur en pixel. au moins pour la largeur ;)

Adns
0
bibibengo Messages postés 18 Date d'inscription mardi 5 juin 2007 Statut Membre Dernière intervention 11 juillet 2011 4
11 juil. 2011 à 15:48
ok c'est bien pigé, merci encore une fois de plus
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
11 juil. 2011 à 15:49
De rien mais pense au tag résolu :)
0

Discussions similaires

créer une adresse gmail pour une autre personne
Emma33000 -
Emma33000 -

2 réponses