image en bouton: espace étrange

-1

d'abord le résultat dans Firefox 4 Beta 8:image en bouton: espace étrange

Button vs Div http://b.imagehost.org/0419/buttonSpace.png

L'ancien élément représenté est un button avec un img ce dernier est un div avec un img. Comme vous pouvez le voir dans le premier cas, il y a un espace étrange entre la bordure du img et la bordure du button. Je me demande comment je peux l'enlever.

Voici le fichier CSS:

* { 
    margin: 0; 
    padding: 0; 
} 

button, img, div { 
    border: 1px solid black; 
} 

img { 
    display: block; 
}

Source

2010-10-12 NikiC

Pouvez-vous montrer le code HTML aussi, si possible? – Nivas

Le test du cas de test ci-dessus dans d'autres navigateurs a montré qu'il ne s'agit probablement pas d'un problème CSS mais d'un bug dans Firefox. J'ai trouvé après un peu de recherche ce rapport de bogue: Bug 140563 - <button> ignores CSS style padding:0

Dans ce rapport de bogue il y a une solution pour le problème:

button::-moz-focus-inner {padding:0; border:0}

Source

2010-10-12 10:08:49 NikiC

Je pense que vous devez définir un width pour la div

Source

2010-10-12 08:38:47

Ma question fait référence à l'espace étrange dans le ** ancien ** cas. Ce dernier est parfaitement clair;) – NikiC

Il ressemble à la padding que vous demandez n'est pas appliquée. Avez-vous essayé de le définir explicitement sur le bouton?

Source

2010-10-12 09:08:55

J'ai donné au bouton un 'padding: 0! Important', ça ne fonctionnait toujours pas. – NikiC

Répondre

Questions connexes