Bandeau haut de page [Résolu/Fermé]

Signaler
Messages postés
50
Date d'inscription
mercredi 4 août 2010
Statut
Membre
Dernière intervention
13 septembre 2013
-
Messages postés
50
Date d'inscription
mercredi 4 août 2010
Statut
Membre
Dernière intervention
13 septembre 2013
-
Bonjour

Je veux mettre un bandeau en haut de la page mais problème il ne prend pas toute la longueur de la page.

#bandeau
{
display: block;
top: 0;
margin: 0;
width: 100%;
height: 60px;
background-color: #FFFFF;
color: white;
}

Il reste centré dans le conteneur:

#contener
{
position: relative;
margin-left: auto;
margin-right: auto;
width: 60%;
height: 100%;
background-color: white;
border: 1px solid #FFFFF;
}

Hors je veux les dissocier, auriez vous la Solution?

4 réponses

Messages postés
1390
Date d'inscription
dimanche 1 juillet 2012
Statut
Membre
Dernière intervention
14 décembre 2012
192
bonjour
rajouter
html, body
{
width: 100%;
}
Messages postés
50
Date d'inscription
mercredi 4 août 2010
Statut
Membre
Dernière intervention
13 septembre 2013
3
Déjà fait

Je n'ai pas mis tout css
et malgré ça le bp persiste
Messages postés
1390
Date d'inscription
dimanche 1 juillet 2012
Statut
Membre
Dernière intervention
14 décembre 2012
192
Donnez plus de code
Messages postés
50
Date d'inscription
mercredi 4 août 2010
Statut
Membre
Dernière intervention
13 septembre 2013
3
Voici le html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" />
<!-- Bienvenue sur monsite.fr -->
<title>monsite</title>
</head>

<div id="contener">
<?php include("header.php"); ?>
<?php include("contener.php"); ?>
<?php include("footer.php"); ?>
<p>Mon site est cool</p>
</div>

<body id="body">

</body>
</html>


Voici tout le css

html, body
{
margin: 0; /* Marge 0 sur la page */
padding: 0;
width: 100%; /* Taille au Max */
background-color: pink; /* Couleur de fond */
color: black;
}

#bandeau
{
display: block;
top: 0;
margin: 0;
width: 100%;
height: 60px;
background-color: #FFFFF;
color: white;
}

#contener
{
position: relative;
margin-left: auto;
margin-right: auto;
width: 60%;
height: 100%;
background-color: white;
border: 1px solid #FFFFF;
}

h1
{
text-decoration: none;
color: white;
background-image: url("photo.jpg");
font-size: 70px;
font-family: Comic Sans MS, "Arial Black", sans-serif;
padding-top:0px;
}

.header
{
display: inline;
color: #00000;
top: 10px;
}
Messages postés
1390
Date d'inscription
dimanche 1 juillet 2012
Statut
Membre
Dernière intervention
14 décembre 2012
192
Votre
<div id="conteneur">
nest pas entre les balises
<body>
et vous n'avez pas de bloc appelé bandeau
Messages postés
50
Date d'inscription
mercredi 4 août 2010
Statut
Membre
Dernière intervention
13 septembre 2013
3
Ca y est j'ai trouvé!! Voici qqs uns de mes codes CSS

#conteneur
{
position: relative; /* Position indépendante du conteneur */
margin: 40px;
margin-left: auto; /* Marge définie suite à position */
margin-right: auto;
width: 60%; /* Largeur auto */
height: 800px; /* Taille de la hauteur */
background-color: white;
border: 2px solid #FD6C9E; /*Bordure*/
border-radius: 20px;
padding: 60px;
}

#bandeau
{
position: absolute;
z-index: 100; /* passe au dessus du conteneur */
top:0;
width: 100%;
height: 40px;
background-image: #FEBFD2;
color: white; /* couleur du texte */
}

Merci, à plus