Bonjour,
Voilà je suis nouveau posteur sur ce forum mais lecteur depuis déjà un moment... Il m'a été trés utile pour m'initier à CSS.
Malheureusement, je ne trouve pas de réponse à mon problème.
Alors je préviens en grand débutant, je fais du code pas propre, j'ai plutôt tendance à le nettoyer en fin de projet...
Voilà, dans la page sur laquelle je travaille, j'ai une boucle qui s'effectue en PHP en liaison avec une table MySQL afin d'afficher une succession de bandeaux dans lesquels se trouvent une miniature et un descriptif de vidéos.
Ces bandeaux sont des div et la miniature y est placée en float : left...
Ci-dessous le code html :
et maintenant le code CSS :
Losque je ne mettais pas l'option overflow : auto, pas de problème, ma bordure s'affiche bien mais la miniature déborde si il n'y a pas assez de texte.
Lorsque je mets l'option overflow : auto, la div qui contient miniature et texte fais la bonne hauteur mais semble plus longue et ma bordure droite disparait. En testant avec une bordure de 2px je me suis rendu compte que du côté droit elle se fait rogner de 1px.
EDIT : bon alors le problème viendrait plutôt du fait que :
Lorsque la page est placée à gauche ou à droite, il n'y a pas de problème... Je refais des recherches sur le centrage des pages au cas où je trouverai une solution.
Modifié par elnino (08 Dec 2006 - 16:55)
Voilà je suis nouveau posteur sur ce forum mais lecteur depuis déjà un moment... Il m'a été trés utile pour m'initier à CSS.
Malheureusement, je ne trouve pas de réponse à mon problème.
Alors je préviens en grand débutant, je fais du code pas propre, j'ai plutôt tendance à le nettoyer en fin de projet...
Voilà, dans la page sur laquelle je travaille, j'ai une boucle qui s'effectue en PHP en liaison avec une table MySQL afin d'afficher une succession de bandeaux dans lesquels se trouvent une miniature et un descriptif de vidéos.
Ces bandeaux sont des div et la miniature y est placée en float : left...
Ci-dessous le code html :
while ($tableau=mysql_fetch_assoc($resultat))
{
echo "<div class = 'bandeauvideo'>";
$p = $tableau['nom'];
$f = strrpos($p, '.');
$sansext = substr($p, 0, $f);
$miniature = $sansext.'.jpg';
echo "<div class='mini'><img src='./videos/".$miniature."' width='120' height='90'></a></div>";
echo "<H1>TITRE : ".$tableau['titre']."</H1> <br>";
echo "<H2>Descriptif : ".$tableau['descr']."</H2>";
echo '</div>';
echo '<br>';
}
et maintenant le code CSS :
.bandeauvideo{
overflow : auto;
font-family:arial, sans-serif;
font-size:80%;
color:white;
background-color:transparent;
border : 1px solid white;
margin-left:1em;
margin-right:1em;
margin-top: 1em;
margin-bottom: 1em;
}
.mini{
float: left;
margin-right: 1em;
margin-left: 1em;
margin-top: 1em;
margin-bottom: 1em;
}
Losque je ne mettais pas l'option overflow : auto, pas de problème, ma bordure s'affiche bien mais la miniature déborde si il n'y a pas assez de texte.
Lorsque je mets l'option overflow : auto, la div qui contient miniature et texte fais la bonne hauteur mais semble plus longue et ma bordure droite disparait. En testant avec une bordure de 2px je me suis rendu compte que du côté droit elle se fait rogner de 1px.
EDIT : bon alors le problème viendrait plutôt du fait que :
#page{
background: #000000;
color: inherit;
width: 780px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
Lorsque la page est placée à gauche ou à droite, il n'y a pas de problème... Je refais des recherches sur le centrage des pages au cas où je trouverai une solution.
Modifié par elnino (08 Dec 2006 - 16:55)