Как сделать отступ в теге html ul li - PullRequest
8 голосов
/ 07 февраля 2012

У меня есть неупорядоченный список, в котором есть маркированный текст.Мне нужно сделать отступ для пунктов списка в строке.Однако для длинного текста стиль не работает должным образом.Я должен выровнять его внутри рамки.Вот код CSS

ul{
    background-color: #FFFFFF;
    border: 1px solid black;
    border-radius: 3px 3px 3px 3px;
    list-style: disc inside none;
    padding: 10px;
}

Вот пример HTML

<div style="padding:20px">
    <ul>
        <li>Should be minimum of 8 characters</li>
        <li>A long running text A long running text A long running text A long running text A long running text</li>
        <li>Should have at least one number</li>
    </ul>
</div>

enter image description here

Ссылка JS Fiddle: http://jsfiddle.net/jHJXq/

Ответы [ 4 ]

20 голосов
/ 07 февраля 2012

Это то, что вы ищете? http://jsfiddle.net/jHJXq/3/

ul{
    background-color: #FFFFFF;
    border: 1px solid black;
    border-radius: 3px 3px 3px 3px;
    list-style: disc outside none;
    padding: 10px 10px 10px 25px;
}

Я изменил стиль списка на "снаружи" и добавил дополнительный отступ слева.

enter image description here

5 голосов
/ 07 февраля 2012

Добавить стиль к LI:

li {
   margin-left:15px;  
}
2 голосов
/ 07 февраля 2012

изменить стиль списка изнутри наружу

list-style: disc outside none;
1 голос
/ 07 февраля 2012
ul{
    background-color: #FFFFFF;
    border: 1px solid black;
    border-radius: 3px 3px 3px 3px;
    list-style: disc;
    padding:10px;
}

li{
    margin-left:10px;
}
...