Je souhaite mettre un bandeau verticale en (middleground c'est a dire entre le background et le texte ) tous au long de mon site mais je n'y arrive pas !
voici mon code html :
<head>
<title>La Pension Du Prato</title>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
<link rel="favicon" href="favicon.ico">
</head>
<body>
<div id="conteneur">
<div id="page">
<header>
<div id='titre' >
<h1>Pension du Prato</h1>
</div>
</div>
<img src="image/header.jpg" alt="image d'en tête" class="header">
</header>
<nav>
<?php include ("menus.php");?> <!-- menus du site-->
</nav>
<section>
<?php include ("aside.php");?> <!-- info du site sur la droite-->
<img src="image/portes_ouvertes.gif" alt="image porte ouverte" class="gif"> <br> <!-- gif porte ouverte -->
<img src="image/carte.jpg" alt="image carte" class="carte">
<div class="cadre">
<p class="paragraphe" style="font-weight:bold">
Au service des <em>chiens et chats</em> depuis 1985 la <em>pension</em> du prato est située au coeur de la Provence sur la commune de Pernes les fontaines.Fort de son expérience nous vous proposons deux modes de garde soit sur site en pension soit à votre domicile sur les communes de pernes les fontaines et carpentras avec deux passages journaliers.La pension accueille vos petites têtes poilues dans un cadre sécurisée avec plusieurs promenades journalières dans un jardin clos au milieu de la pension .Des promenades en totale liberté mais à tour de role pour éviter tous risques de bagarres ou de contaminations des maladies.Pension ombragée l'été et chauffée l hiver.Nous restons à votre entière disposition pour visiter nos installations.tel 0490613834 / 0679540928
</p>
</div>
</section>
</div>
<footer>
</footer>
</body>voici maintenance mon css :
body
{
background-image: url("image/background.jpg"); /*image de fond du site*/
}
p.paragraphe
{
margin: 0 auto;
width: 686px;
font-size:1.5em;
}
#page
{
text-align: center;
background-position: center;
background-color: #000000;
opacity: 0.3;
}
#cadre
{
}
#titre
{
font-size:3em; /* taille du titre*/
color: #FF00EB; /* fond du site au niveau du titre*/
text-decoration:bold; /* mise en gras du titre*/
border:1px solid black
}
em
{
font-style:normal; /*supression italique des em */
}
#conteneur
{
width: 970px; /*taille du site en largeur*/
margin: 0 auto; /*centrage du site*/
}
.gif
{
margin-bottom:10px
}
.carte
{
margin-bottom:10px;
}
