[jQuery] Problem z listą

Przyznam, że nigdy nie korzystałem z list, bo nie były mi potrzebne przy żadnych projektach, a teraz muszę ich użyć i mam problem:

html:

<div id="kontyner_menu">
  <ul>
    <li class="logo"><a href="index.html"></a></li>
    <li class="onas"><a href="onas.html"></a></li>
    <li class="krycie"><a href="krycie.html"></a></li>
  </ul>
</div>

css:

#kontyner_menu{
  width: 800px;
  height: 81px;
  margin: auto;
}

#kontyner_menu ul{
  	margin: 0px;
  	padding: 0px;
}
  
  #kontyner_menu ul li{
  	margin: 0px;
  	padding: 0px;
  	list-style: none;
  	height: 81px;
  }
  
  #kontyner_menu ul li a{
  	display: block;
  	cursor: pointer;
  	height: 81px;
  }

      #kontyner_menu ul li.logo{
      	width: 300px;
      	background: url('images/logo.jpg') no-repeat;
      }
      
      #kontyner_menu ul li.onas{
      	width: 200px;
      	background: url('images/onas.jpg') no-repeat;
      }
      
      #kontyner_menu ul li.krycie{
      	width: 300px;
      	background: url('images/krycie.jpg') no-repeat;
      }

I problem jest taki, że pozycje z menu wyświetlają się jedna pod drugą,a chciałbym, żeby były obok siebie.

poszukaj o <css>display:in-line;</css> albo <css>float:left;</css>

Ani display: inline (muszę mieć element blokowy), ani float: left, mnie nie urządza.

Czemu float: left Cię nie urządza?

float: left jednak działa, wcześniej coś mi się rozjeżdżało, dzięki.

Samo menu działa, ale mam teraz problem z zanimowaniem go w jQuery.

Mam następujący kod (używam biblioteki do operowania na tle)

$('li.onas')
		.mouseover(function(){
			$(this).stop().animate({backgroundPosition:"(0 -81px)"}, {duration:300})
		})
		.mouseout(function() {
			$(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:100, complete:function(){
				$(this).css({backgroundPosition: "0 0px"})
}});

i wszystko działa, ale jak dodaje drugi podobny kod z tym, że dla elementów logo i krycie to nie działa nic.

Dobra, poradziłem sobie

Dałem akcję w jQuery ogólnie dla elementu $('li') (bez podelementów) :)