Comment définir l'espacement des lignes d'une liste ordonnée de manière cohérente sur tous les navigateurs?

J'ai une liste ordonnée qui utilise de grandes Géorgie pour la numérotation et la police Arial plus petite pour le texte (comme l'a recommandé à Comment aligner deux colonnes de texte en CSS). Je suis à l'aide de balises p à l'intérieur de la li afin que je puisse régler la taille de la police, qui définit également les associés de la hauteur de ligne (assurez-vous qu'il est normal interligne si la li courir sur plus d'une ligne). C'est presque bien, mais dans firefox, l'espacement entre les balles est beaucoup plus que n'importe quel autre navigateur, tous les autres semblent être l'ajout d'une marge au-dessus de la p balises en dépit de définir explicitement les marges à 0. Quand je la regarde utilisant les outils de développement de Chrome, il semble ajouter -webkit-marge avant: cadratin (1 em;
-webkit-marge-après: cadratin (1 em; de la p des balises qui ne sont pas remplacées. Cela peut ne pas être la cause, comme il arrive aussi dans non les navigateurs webkit en dehors de FF et tout le reste que j'ai lu dit que ce sont remplacées par la définition de la marge (qui sont définis dans le code ci-dessous et en haut de mon fichier css avec un tout élément css marge de réinitialisation). Je serais très reconnaissante si quelqu'un pouvait rappeler pourquoi je suis de plus l'espacement sur tous les non FF navigateurs que j'ai essayé de travailler depuis des siècles, et ne vois pas pourquoi il se passe! Pour info, j'ai essayé de définir explicitement la hauteur de ligne de chaque élément, mais cela a exactement le même effet. Vous pouvez voir le code ci-dessous.

Merci beaucoup pour votre aide et pour tout conseil que n'importe qui peut donner!

Dave

ol {
color: #ec008c;
margin: 0;
padding: 0 0 0 1.6em;
list-style-position: outside;
font-family: georgia, serif;
font-size: 16px;
font-weight: bold;
}

ol li {
margin: 0;
padding: 0;
}

ol li p {
font-family: arial, sans-serif;
font-weight: normal;
font-size: 10px;
color: #000000;
margin: 0 0 4px 0;
padding: 0;
display: block;
}

<div id="playlist">
<div id="playlistinner">
<p id="playlisttitle">The List</p>
<ol>
<li class="listitem"><p><strong>Entry 1</strong> - entry details</p></li>
<li class="listitem"><p><strong>Entry 2</strong> - entry details</p></li>
<li class="listitem"><p><strong>Entry 3</strong> - entry details that are much longer and span more than one line</p></li>
<li class="listitem"><p><strong>Entry 4</strong> - entry details</p></li>
<li class="listitem"><p><strong>Entry 5</strong> - entry details</p></li>
</ol>
</div>
</div>

OriginalL'auteur deshg | 2011-06-01