<ul> и margin

tvolf · December 21, 2008

Всем привет.

Столкнулся с такой ситуацией (возможно, в ней нет ничего необычного, но так как я новичок, мне она показалась странной).

Есть такой код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1251">  
  <style type="text/css">
     * {padding:0; margin:0}
     #content {margin:0 50px}
  </style>
</head>
<body>
<div id="content">
  Пример списка 
  <ul>
   <li>Пункт 1</li>
   <li>Пункт 2</li>
   <li>Пункт 3</li>
  </ul>
</div>  
</body>
</html>

По идее, все содержимое div'а content должно быть сдвинуто слева и справо на 50 пикселов. Открыв данный файлик в FF3 и IE6 (возможно, и в других браузерах) видим, что маркеры элементов списка выходят за границы div'а content, то есть, начинаются несколько левее. По моим прикидкам

они должны бы быть выровнены по левому краю с надписью "Пример списка"... В чем тут может быть дело ? Это какая-то особенность списков

<ul>..</ul> ? Поясните, плз ? Заранее благодарю.

e1f · December 24, 2008

ul { list-style-position:inside }

s0rr0w · December 24, 2008

По идее, все содержимое div'а content должно быть сдвинуто слева и справо на 50 пикселов. Открыв данный файлик в FF3 и IE6 (возможно, и в других браузерах) видим, что маркеры элементов списка выходят за границы div'а content, то есть, начинаются несколько левее. По моим прикидкам
они должны бы быть выровнены по левому краю с надписью "Пример списка"... В чем тут может быть дело ? Это какая-то особенность списков
<ul>..</ul> ? Поясните, плз ? Заранее благодарю.

Маркеры не принадлежат боксу, к которому они привязаны, они расположены с отрицательным смещением относительно левого края LI.

Это абсолютно нормальное поведение.

Sign In

<ul> и margin

Question

tvolf

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

e1f

Link to comment

Share on other sites

s0rr0w

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information