Je continu la réalisation de ma petite gallerie (cf http://www.phpfrance.com/forums/voir_sujet-22850.php que j'ai résolu tt seul parceque j'avais fait une bête erreur
et voilà mon problème actuellement, donc ma page est divisée en deux partie:
une partie à gauche où sont placées les miniatures et une partie à droite où la photo s'affiche en grand.
bon alors j'en arrive à mon problème, je voudrait pouvoir centrer mon bloc de gauche dans la hauteur, et si possible mettre sa hauteur en pourcents (ou alors une ahuteur minimale qui irait avec toutes les résolutions au pire)
j'ai essayer de faire par exemple:
Code : Tout sélectionner
#bloc {
width: 80%;
margin-top: 10%; //la moitiée de la hauteur qui reste
}Code : Tout sélectionner
<!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=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="./css/styles.css" media="screen" />
<script type="text/javascript" src="./js/galerie.js"></script>
<title>Galerie photo</title>
</head>
<body>
<div id="galerie">
<ul id="galerie_mini">
//miniatures
</ul>
<dl id="photo">
// grande photo
</dl>
</div>
</body>
</html>Code : Tout sélectionner
body{
background: #eed ;
margin:0px;
padding:0px;
}
div#galerie
{
width: 100% ;
padding: 0px ;
margin: 0px ;
text-align: center ;
font: 0.9em Georgia, serif ;
}
ul#galerie_mini
{
display: block;
margin: 0 ;
padding: 0 ;
list-style-type: none ;
float: left;
height: 500px;
margin-top: 50px;
width: 200px;
overflow: auto;
}
ul#galerie_mini li
{
}
ul#galerie_mini li a img
{
margin: 2px 1px ;
border: 1px solid #dcb ;
}
dl#photo
{
float: top;
margin: 0 auto ;
}
dl#photo dt
{
font: italic 2.5em/1.5em Georgia, serif ;
color: #dcb ;
padding: 0px;
margin: 0px;
}
dl#photo dd
{
margin: 0 ;
}
dl#photo img
{
border: 1px solid #dcb ;
}Voilà en espérant que quelqun ai la solution ...
merci d'avance