Question

J'ai un petit problème avec la mise en œuvre de l'éditeur Derobin ADM.

Il ne semble pas être mise en forme correctement et je ne suis pas tout à fait sûr pourquoi. Bien que je ne sais pas si je devrais demander cela sur Doctype ou pas non plus.

J'utilisais les exemples de texte démarquage de la référence SO, ce qui bien sûr doit ressembler à la suivante:

  1. Listes dans un élément de la liste:
    • quatre espaces dentelés.
      • dentelées huit espaces.
    • Quatre espaces à nouveau.
  2. paragraphes multiples dans un des éléments de liste: Il est préférable de mettre en retrait les paragraphes quatre espaces Vous pouvez vous en sortir avec trois, mais il peut obtenir confusion lorsque vous imbriquer d'autres choses. Tenez-vous à quatre.

    Nous indenté la première ligne d'un espace supplémentaire pour aligner avec ces paragraphes. En utilisation réelle, nous pourrions faire que la liste entière afin que tous les éléments soient alignés.

    Ce paragraphe fait toujours partie de l'élément de la liste, mais il semble en désordre à l'homme. Il est donc une bonne idée d'envelopper vos paragraphes imbriqués manuellement, comme nous l'avons fait avec les deux premiers.

  3. dans un élément citations en blocs de liste:

  

Passer une ligne et   quatre espaces de retrait "du>.

  1. texte préformaté dans un élément de la liste:

    Skip a line and indent eight spaces.
    That's four spaces for the list
    and four to trigger the code block.
    

Cependant, ce que je reçois ressemble à ceci:

Je pense que cela est lié CSS, mais je ne vois pas ce qui le cause. Je peux poster le CSS si elle est nécessaire, mais je serais probablement poster tout cela que je ne suis pas sûr de ce qui le cause. Cependant, je ne suis pas sûr que ce pourrait être lui-même le script réel (que je trouve douteux que les exemples de travail et moi avons simplement copié exactement le même code).

Je tiens également à souligner que l'exemple qui vient avec le téléchargement des ADM fonctionne très bien sur son propre, mais une fois que je l'ajoute à ma demande, le produit ci-dessus.

Je dois aussi ajouter que ce problème est persistant dans IE7 / 8 et Firefox 3.5.

Toute aide est très appréciée.


EDIT: Résolu les Puces / numéros apparaissant en dehors de la boîte avec l'ajout de style CSS pour ol et ul de la liste de style positions: à l'intérieur; mais le reste reste toujours le même.

EDIT: Modifier en fonction des commentaires des utilisateurs. La sortie étant HTML est:

<ol>
<li>Lists in a list item:
<ul><li>Indented four spaces.
<ul><li>indented eight spaces.</li></ul></li>
<li>Four spaces again.</li></ul></li>
<li><p>Multiple paragraphs in a list items:
It's best to indent the paragraphs four spaces
You can get away with three, but it can get
confusing when you nest other things.
Stick to four.</p>

<p>We indented the first line an extra space to align
it with these paragraphs.  In real use, we might do
that to the entire list so that all items line up.</p>

<p>This paragraph is still part of the list item, but it looks messy to humans. So it's a good idea to wrap your nested paragraphs manually, as we did with the first two.</p></li>
<li><p>Blockquotes in a list item:</p></li>
</ol>

<blockquote>
<p>Skip a line and
indent the >'s four spaces.</p>
</blockquote>

<ol>
<li><p>Preformatted text in a list item:</p>

<pre><code>Skip a line and indent eight spaces.
That's four spaces for the list
and four to trigger the code block.
</code></pre></li>
</ol>
Était-ce utile?

La solution

dans votre fichier CSS que vous avez ceci:

* {
    margin:0;
    padding:0;
}

qui est une remise à zéro universel qui élimine le rembourrage et la marge de tout. Comme je l'ai dit sur Doctype.com.

Vous devrez supprimer cela, et utiliser une plus réinitialisation contrôlable, ou définir certains types de remplissage par défaut et des marges pour ul et de Li en général.

Comme chaque navigateur semble avoir des valeurs par défaut pour des années ul j'ai tendance à les omettre de mon reset et plus précisément de nav ul.

voici la remise à zéro J'utilise:

div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    }

qui remet presque tout autre que les listes.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top