Ul Li Display: Inline; - Отступы При Использовании Бэграунда

[gard]

Здравствуйте!

Подскажите по ситуации, имею CSS:

#maincontent > .sectionmenu {
position: relative;
margin: 0px 0px 0px 1px;
padding: 0;
width: 990px;
height: 23px;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}

#maincontent > .sectionmenu.shadowline{
~height: 9px;
margin: 0;
padding: 0px 0px 9px 0px;
background: #fff url(/shdw3.png) top left no-repeat;
}

#maincontent > .sectionmenu ul{
background-color: #fff;
margin: 0;
padding: 0;
height: 23px;
}

#maincontent > .sectionmenu  ul li{
list-style: none;
~display: inline;
background-color: #dedede;
color: #333;
padding: 0px 5px 0px 5px;
margin: 0;
font-size: 11px;
line-height: 23px;
height: 23px;
}

#maincontent > .sectionmenu ul li:hover{
background-color: #ccc;
}

На странице использую так:

	<div id="maincontent">
		<div class="sectionmenu">
			<ul>
				 <li><a href="#">Ladders & Sticks</a></li>
				 <li><a href="#">Hurdles</a></li>
				 <li><a href="#">Training Accessories</a></li>
				 <li><a href="#">Smart-Cart Training System</a></li>
				 <li><a href="#">Smart-Hurdle Collection</a></li>
				 <li><a href="#"> - VIEW ALL - </a></li>
			</ul>
		</div>
				</div>

Проблема в том, что когда для li указано display: inline; то возникают непонятные отступы как бы внутри (без расширения самого li), и при наведении на li область ссылки закрашивается не полностью, а как бы прямоугольником по центру..

[gard]

Прошу прощения, уже разобрался =) Работат.. Применил для li display: block; float: left; и для a display: block;

[s0rr0w]

Применил для li display: block; float: left;

Масло масляное. После float любой элемент становится блочным.

[swetlana]

s0rr0w, не путайте.

float применим к блочным элементам, но он не делает элементы таковыми.

[Vlad]

display: block для li не нужен, лишний.

[gard]

Да, я его для ссылки сделал..

[s0rr0w]

s0rr0w, не путайте.

float применим к блочным элементам, но он не делает элементы таковыми.

float применим к любым элементам. Сам элемент может и не меняет своей сути, но обязательно генерирует блок. Читаем спеку.

http://www.w3.org/TR/CSS21/visuren.html#propdef-float

The element generates a block box that is floated to the left.

Не факт, что нужно именно генерировать анонимный блок, под этим может скрываться и смена типа элемента на блочный.

Блин, написали так, что не сильно однозначно понятно. Читаем раздел http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo

Элементу меняется display согласно таблице.