Наличие разрывов строк между тегами < li > s

Question

У меня есть горизонтальное меню, состоящее из элементов < li > с display: inline .

Элементы должны быть рядом друг с другом без проблем.

В исходном коде я бы хотел, чтобы каждый li был в одной строке для упрощения отладки:

<li class="item1 first"> ... </li>
<li class="item2"> ... </li>
...

Однако, если я добавлю \ n после каждого элемента, пункты меню будут иметь разрыв между собой. Я понимаю, что это предполагаемое поведение, но есть ли способ отключить его с помощью умного «пробела» установка или что-то?

  

Изменить: я не могу использовать float, это в CMS с возможностью центрировать элементы списка.

Answer 1

Вы можете избежать проблем рендеринга, но сохранить поддерживаемый код следующим образом:

<ul
  ><li>item 1</li
  ><li>item 2</li
  ><li>item 3</li
></ul>

Он удаляет пробелы, но все еще легко редактировать элементы в текстовом редакторе при условии, что ваша CMS не связывается с введенной вами разметкой!

Answer 2

У вас есть возможность редактировать CSS? Если это так, вы можете попробовать настроить отступы / поля в теге < li > элемент. Это, кажется, требует много усилий для удобства чтения.

В зависимости от того, какой браузер вы используете, вы можете получить HTML Tidy http: //users.skynet .be / mgueury / mozilla / , которая дает вам возможность привести в порядок ваш исходный код, который может быть достаточно полезен для отладки

Answer 3

CSS + float - ваш друг.

Answer 4

HTML не зависит от пробелов, поэтому добавление разрывов строк не должно иметь никакого эффекта. Однако некоторые механизмы рендеринга браузера не совсем правильно понимают это.

Что вы, вероятно, хотите сделать, это добавить

float: left;

к вашим тегам li, чтобы получить их рядом друг с другом.