Pergunta

Eu tenho um pequeno problema com a implementação do editor de WMD de Derobin.

Ele não parece ser formatar corretamente e eu não sou inteiramente certo porque. Embora eu não tenho certeza se eu deveria estar perguntando isso em Doctype ou não quer.

Eu estava usando os exemplos de texto remarcação a partir da referência SO, o que naturalmente deve ser semelhante a seguir:

  1. Lists em um item da lista:
    • indentado com quatro espaços.
      • recuado oito espaços.
    • espaços Quatro novamente.
  2. Vários parágrafos em um item da lista: É melhor recuar parágrafos quatro espaços Você pode sair com três, mas ele pode ficar confuso quando você aninhar outras coisas. Vara para quatro.

    Nós recuado a primeira linha um espaço extra para alinhar -lo com estes parágrafos. Em utilização real, nós pode fazer que a toda a lista de modo que todos os itens se alinham.

    Este parágrafo é ainda parte do item da lista, mas parece confuso para os seres humanos. Portanto, é uma boa idéia para quebrar seus parágrafos aninhadas manualmente, como fizemos com os dois primeiros.

  3. Bloco de citação em um item da lista:

Ir uma linha e travessão do> 's quatro espaços.

  1. Texto pré-formatado em um item da lista:

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

No entanto, o que eu recebo parece com isso:

Exemplo de emissão

Eu acho que isso é relacionado CSS, mas eu não posso ver o que está causando isso. Eu posso postar o CSS se for necessário, mas eu provavelmente postar tudo isso como eu não tenho certeza do que está causando isso. No entanto, eu não tenho certeza se ele poderia ser o próprio script real (o que eu acho duvidoso como os exemplos trabalhar e eu simplesmente copiado exatamente o mesmo código).

Gostaria também de salientar, que o exemplo que vem com o download de ADM funciona bem, por si própria, mas uma vez eu adicioná-lo ao meu pedido, o acima ocorre.

Gostaria também de acrescentar que este problema é persistente no IE7 / 8 e Firefox 3.5.

Qualquer ajuda é muito apreciada.


EDIT: resolvido o Símbolos / números que aparecem no exterior da caixa com a adição de estilo CSS para ol e ul de lista de estilo posições: dentro; mas o resto continua o mesmo.

EDIT: Editar com base em comentários do usuário. A saída ser HTML é:

<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>
Foi útil?

Solução

em seu arquivo css você tem isso:

* {
    margin:0;
    padding:0;
}

que é uma reposição universal que remove preenchimento e margem de tudo. Como eu disse na Doctype.com.

Você precisará remover isso, e usar uma redefinição mais controlável, ou definir algum estofamento padrão e margens para ul de e li de em geral.

Como cada navegador parece ter diferentes padrões para ul é que tendem a omitir-los do meu reset e estabelecer nav ul é especificamente.

aqui é o uso de reset I:

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;
    }

que redefine quase tudo que não seja listas.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top