Bonjour, je voulais juste savoir si les codes que j'ai utilisé marche pour toute les résolutions donc voici les codes :
HTML :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" />
<title>Test</title>
</head>
<body>
<div id="bloc_page">
<header>
<h1 id="Titre"></a></h1>
<h2>Serveur privé</h2>
</header>
<nav>
<ul id="menu">
<li><a href="#">Connection</a></li>
<li><a href="#">Photo</a></li>
<li><a href="#">Recrutement</a></li>
<li><a href="#">Diver</a></li>
<li><a href="#">Deconnection</a></li>
</ul>
<article>
<div id="contenu">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois </p>
</div>
<div id="contenu2">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois
de février 1804, n'hésite pas à lui proposer la
constitution d'une forme de gouvernement à transmission
héréditaire.</p>
</div>
<div id="contenu3">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois
de février 1804, n'hésite pas à lui proposer la
constitution d'une forme de gouvernement à transmission
héréditaire.</p>
</div>
<div id="contenu4">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois </p>
</div>
</article>
</nav>
</div>
</body>
</html>
code CSS :
#bloc_page
{
margin: auto ;
width: 867px ;
}
body
{
margin: 0;
padding:0;
outline:0;
font-family: Comic Sans MS, Trebuchet MS, Courier New , Verdana;
}
header
{
border: 2px solid #deb887;
background: url(http://imageshack.us/a/img13/1111/uvz.png) no-repeat left top #ffebcd;
height: 150px ;
}
#Titre
{
background: url(http://imageshack.us/a/img199/2735/v3yy.png) no-repeat ;
height: 78px;
width: 370px;
display: block ;
margin-top: 30px ;
margin-left: 210px ;
}
header h2
{
margin-top: -45px ;
margin-left: 545px ;
height: 25px ;
width: 160px ;
text-align: center ;
font-size: 1em;
font-weight: normal;
}
ul#menu
{
display: block ;
border-bottom: 2px solid #deb887;
border-left: 2px solid #deb887;
border-top: 2px solid #deb887;
margin-top: 5px;
width: 865px;
height: 35px ;
padding: 0 ;
list-style-type: none ;
background: url(http://imageshack.us/a/img545/7691/rh80.png) no-repeat left top #ffebcd ;
}
ul#menu li
{
float: left ;
text-align: center ;
}
ul#menu li a
{
width: 171px ;
line-height: 35px ;
font-size: 1em ;
font-weight: normale ;
letter-spacing: 1px ;
color: #000000 ;
display: block ;
text-decoration: none ;
border-right: 2px solid #deb887 ;
}
ul#menu li a:hover
{
background: url(http://www.colorhexa.com/6b8e23.png) repeat-x 0 0 ;
}
h3
{
text-align: center ;
}
#contenu
{
border: 2px solid #deb887;
background-color: #ffebcd;
width: 151px ;
padding: 10px;
text-align: justify ;
float: left;
}
#contenu4
{
border: 2px solid #deb887;
background-color: #ffebcd;
width: 151px ;
padding: 10px;
text-align: justify ;
float: right ;
margin-top: -762px ;
}
#contenu2
{
border: 2px solid #deb887;
margin-left: 180px ;
background-color: #ffebcd;
padding: 10px;
text-align: justify ;
margin: 180px ;
margin-top: -11px ;
}
#contenu3
{
border: 2px solid #deb887;
margin-left: 180px ;
background-color: #ffebcd;
padding: 10px;
text-align: justify ;
margin: 180px ;
margin-top: -175px ;
}
Voila !
HTML :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" />
<title>Test</title>
</head>
<body>
<div id="bloc_page">
<header>
<h1 id="Titre"></a></h1>
<h2>Serveur privé</h2>
</header>
<nav>
<ul id="menu">
<li><a href="#">Connection</a></li>
<li><a href="#">Photo</a></li>
<li><a href="#">Recrutement</a></li>
<li><a href="#">Diver</a></li>
<li><a href="#">Deconnection</a></li>
</ul>
<article>
<div id="contenu">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois </p>
</div>
<div id="contenu2">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois
de février 1804, n'hésite pas à lui proposer la
constitution d'une forme de gouvernement à transmission
héréditaire.</p>
</div>
<div id="contenu3">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois
de février 1804, n'hésite pas à lui proposer la
constitution d'une forme de gouvernement à transmission
héréditaire.</p>
</div>
<div id="contenu4">
<h3>Bienvenu</h3>
<p>En 1799, Napoléon Bonaparte est nommé Premier Consul.
Chef d'État d'une République qui redevient prospère sous
sa direction, il se présente comme l'homme providentiel
sur lequel la France peut compter. Le 27 mars 1804, le
sénat, se fondant sur le péril d'une restauration
monarchique suite au complot royaliste de Cadoudal du mois </p>
</div>
</article>
</nav>
</div>
</body>
</html>
code CSS :
#bloc_page
{
margin: auto ;
width: 867px ;
}
body
{
margin: 0;
padding:0;
outline:0;
font-family: Comic Sans MS, Trebuchet MS, Courier New , Verdana;
}
header
{
border: 2px solid #deb887;
background: url(http://imageshack.us/a/img13/1111/uvz.png) no-repeat left top #ffebcd;
height: 150px ;
}
#Titre
{
background: url(http://imageshack.us/a/img199/2735/v3yy.png) no-repeat ;
height: 78px;
width: 370px;
display: block ;
margin-top: 30px ;
margin-left: 210px ;
}
header h2
{
margin-top: -45px ;
margin-left: 545px ;
height: 25px ;
width: 160px ;
text-align: center ;
font-size: 1em;
font-weight: normal;
}
ul#menu
{
display: block ;
border-bottom: 2px solid #deb887;
border-left: 2px solid #deb887;
border-top: 2px solid #deb887;
margin-top: 5px;
width: 865px;
height: 35px ;
padding: 0 ;
list-style-type: none ;
background: url(http://imageshack.us/a/img545/7691/rh80.png) no-repeat left top #ffebcd ;
}
ul#menu li
{
float: left ;
text-align: center ;
}
ul#menu li a
{
width: 171px ;
line-height: 35px ;
font-size: 1em ;
font-weight: normale ;
letter-spacing: 1px ;
color: #000000 ;
display: block ;
text-decoration: none ;
border-right: 2px solid #deb887 ;
}
ul#menu li a:hover
{
background: url(http://www.colorhexa.com/6b8e23.png) repeat-x 0 0 ;
}
h3
{
text-align: center ;
}
#contenu
{
border: 2px solid #deb887;
background-color: #ffebcd;
width: 151px ;
padding: 10px;
text-align: justify ;
float: left;
}
#contenu4
{
border: 2px solid #deb887;
background-color: #ffebcd;
width: 151px ;
padding: 10px;
text-align: justify ;
float: right ;
margin-top: -762px ;
}
#contenu2
{
border: 2px solid #deb887;
margin-left: 180px ;
background-color: #ffebcd;
padding: 10px;
text-align: justify ;
margin: 180px ;
margin-top: -11px ;
}
#contenu3
{
border: 2px solid #deb887;
margin-left: 180px ;
background-color: #ffebcd;
padding: 10px;
text-align: justify ;
margin: 180px ;
margin-top: -175px ;
}
Voila !