Aller au contenu

Régler la bordure d'une photo


v4np13

Sujets conseillés

Bonjour,

J'ai un petit problème de bordure sur cette page: http://objectifd1.celeonet.fr/photos/

Sur IE, bizarrement, ça fonctionne au poil tandis que sur firefox, il y a quelques pixels en trop en bas et à droite.

Voici le code CSS:

.rssThumbFloat a{
background-color: transparent;
 float: left;
 width: 100px;
 height: 100px;
 border: 2px solid #AAAAAA;
 margin: 0 15px 15px 0;
 text-align: center;
 padding: 2px;
}
.rssThumbFloat a:hover{
 border-color: #488ED3;
 margin: 0 15px 15px 0;
}
.rssThumb{
display: block;
color: #FFF;
background-color:transparent;
width: 96px;
height: 96px;
text-align: center;
text-decoration: none;
}
.rssThumbFloat img{
border:0;
}

Merci pour votre aide

Lien vers le commentaire
Partager sur d’autres sites

A mon avis c'est le padding qui dérègle le tout.

Sous Internet explorer il s'ajoute à la taille de la boîte, contrairement aux recommandations du W3C.

C'est probablement la raison pour laquelle tu as dû mettre une taille de 96px, pour arriver à 100px avec 2px de padding de part et d'autre ;)

Dan

Lien vers le commentaire
Partager sur d’autres sites

Si j'enleve le padding, elle sera calée dans le haut à gauche.

J'aimerai obtenir le résultat qu'on voit sur IE avec FF. J'ai déjà fait quelques essais sans résultats concluants. J'aime bien l'espace entre la photo et la bordure, ça fait un peu "respirer" le site.

Comment puis-je y arriver?

Lien vers le commentaire
Partager sur d’autres sites

Il faut toujours garder à l'esprit, dès qu'on met du padding, que I.E. ne le gère pas comme il devrait.

Le padding est compté à tort en plus de la taille de la boîte contenante.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...