<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<style type="text/css" media="screen">
#gauche_ma /* les boxes a gauches*/
{
float: left; /* Le menu flottera ?� gauche */
width: 180px; /* Tr�s important : donner une taille au menu */
}
#droite_ma /* les deux boxes � droites */
{
float: right; /* Le menu flottera � gauche */
width: 180px; /* Tr?s important : donner une taille au menu */
}
#centre /* les deux boxes � droites */
{
float: left; /* Le menu flottera �gauche */
width: 427px; /* Tr?s important : donner une taille au menu */
margin: 0px;
text-align:center;
}
.element_menu /* les cases gauches droites */
{
background-color: #f8f5ec;
background-image: url('http://img819.imageshack.us/img819/6530/ornement.jpg');
border: 1px dashed #b3aba0;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-�-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
margin: 5px;
padding: 5px;
text-align:center;
height: 200px;
}
.centre_boite
{
float:left;
background-color: #f8f5ec;
background-image: url('http://img819.imageshack.us/img819/6530/ornement.jpg');
height: 200px;
width: 427px;
border: 1px dashed #b3aba0;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-�-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
overflow-y: auto;
overflow-x: visible; /* Essaie ?galement hidden */
margin-top:5px;
text-align: justify;
padding:5px;
margin-bottom:5px;
}
div.infobulle
{
position: relative;
float: center;
cursor: e-resize;
color: black;
}
div.infobulle span
{
display: none; /* ceci masque l'infobulle */
cursor: e-resize;
}
div.infobulle:hover
{
background: none; /* correction d'un bug IE */
z-index: 999; /* on d?finit une valeur pour l'ordre d'affichage */
cursor: e-resize;
color: black;
}
div.infobulle:hover span
{
display: inline; /* on affiche l'infobulle */
position: absolute;
top: 10px; /* on positionne notre infobulle */
background-color: #e2d9ca;
color: #7a7975;
padding: 3px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-�-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
white-space: nowrap;
text-align: center;
font-size: 12px;
font-family: century gothic;
}
.transparence
{
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover
{
background-color: transparent;
border: none;
opacity: 2;
}
.navig
{
background-color: #efeae3;
font-size: 12px;
font-weight: normal;
font-family: Arial;
width:150px;
display: block;
margin-left: auto;
margin-right: auto;
text-align:center;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-�-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
}
.navig:hover
{
background-color: #e2d9ca;
display: block;
}
.ma_h2
{
font-size: 12px;
text-align: center;
border-bottom:4px double #89A3C7 ;
font-family:century gothic;
color: #89A3C7 ;
}
</style>
</head>
<body>
<div style="width:800px;">
<div id="gauche_ma">
<div class="element_menu"> <h2 class="ma_h2">Liens utiles</h2>
<a href="salut" class="navig">Salut</a>
<a href="salut" class="navig">Salut</a>
<a href="salut" class="navig">Salut</a>
<a href="salut" class="navig">Salut</a>
<p>
Annuaires + images
</div>
</div>
<div id="centre">
<div class="centre_boite"> <h2 class="ma_h2">Bienvenue au pensionnat Saint-Ange !</h2>
<p>Le pensionnat Saint-Ange accueille les jeunes d�linquants issus de tr�s riches familles, familles qui payent des sommes astronomiques chaque mois au pensionnat pour que le secret soit bien gard�. Car �videmment, on ne peut pas d�cemment dire que la tr�s ch�re fille du PDG de telle grosse soci�t� a �t� prise le nez dans la poudre, ou que le fils de telle star a fracass� la t�te d'un paparazzi un peu trop z�l�. Donc, on fait croire que les ch�rubins se sont envol�s pour de prestigieuses universit�s, ou investis dans des �uvres humanitaires � l'�tranger, le temps qu'ils purgent leur s�jour au pensionnat. Mais, d�trompez vous, jamais cette prog�niture dissip�e ne voudra quitter Saint-Ange... Car ce pensionnat, mes amis, c'est le r�ve �veill� de tout adolescent �pris de vices et de d�cadence. Mais si vous comptiez garder vos secrets bien au chaud, c'est rat�. Car moi, Mademoiselle, je suis l� pour tout d�voiler... Au grand jour. C'est pas de chance, hein ?</p>
Design & CSS � Esther Williams - Images utilis�es � Mellolover ; Maggi ; Korone ; Yukikominazuki<br>
Contexte & textes administratifs � Lord Van Alexender & Esther Williams<br>
Le contenu du forum appartient � ses auteurs respectifs, merci de respecter leur travail.<br>
Ce forum est prot�g� par le droit de la propri�t� intellectuelle,<br>
Toute reproduction partielle et/ou totale du forum et/ou de son contenu est strictement interdite !<br>
PA r�alis�e par James1920 de CSSActif, modifi�e par Esther.W.
</div>
</div>
<div id="droite_ma">
<div class="element_menu"> <h2 class="ma_h2">Le staff</h2>
<div class="infobulle"><img src="http://img690.imageshack.us/img690/2646/logoesther.jpg" class="transparence" /><span><img src="http://img202.imageshack.us/img202/66/esther.png">
<div><strong><a href="http://saint-ange.forumactif.org/profile.forum?mode=viewprofile&page_profil=contact&u=1">Esther Williams</a></strong><br/><strong>Admin</strong><br/></div></div>
<div class="infobulle"><img src="http://img690.imageshack.us/img690/2036/logolordy.jpg" class="transparence" /><span><img src="http://img707.imageshack.us/img707/2998/lordy.png">
<div><strong><a href="http://saint-ange.forumactif.org/profile.forum?mode=viewprofile&page_profil=contact&u=2">Lord Van Alexender</a></strong><br/><strong>Admin</strong><br/></div></div>
</div>
</div>
</div>
</div>
</body>
</html>
Lun 03 Juin 2024, 17:20 par 
