css image in one line

Sveiki, katik pradejau mokytis css/html dizainu kodavimo, ir iskart susiduriau su problema, kaip padaryti, kad sie 2 mygtukai butu vienoje eiluteje:

http://img843.imageshack.us/img843/1669/85575737.jpg

display: inline;

arba display: block; float: left;

aciu uz pagalba :). dar vienas klausimelis, kaip dabar padaryt, kad nebutu tarpelio tarp tu 2 paveiksleliu? :)

-

kodas css:

div.meniu { display: inline; width: 57px; margin: 0px; padding: 0px; }

kodas html:

<div class="meniu">

  		<a href="index.html" target="_blank"><img src="images/pradzia.png" border="0"> </a>
  		<a href="index.html" target="_blank"><img src="images/informacija.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/siuntiniai.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/taisykles.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/kontaktai.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/parama.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/reklama.png" border="0"> </a>

   </div>

nepadeda, kaip yra tas tarpelis taip yra..

display: inline;

arba display: block; float: left;

Keista kad nesusimastei tiesiog display: inline-block daryt.

Keista kad nesusimastei tiesiog display: inline-block daryt.

display: inline-block; nepalaiko kai kurios narsykles (berods IE) tai paprasciau yra daryti block ir float, o po to clearinti. na nebent tau neaktualus atvaizdavimas skirtingose narsyklese :)

kodas css:

div.meniu { display: inline; width: 57px; margin: 0px; padding: 0px; }

kodas html:

<div class="meniu">

  		<a href="index.html" target="_blank"><img src="images/pradzia.png" border="0"> </a>
  		<a href="index.html" target="_blank"><img src="images/informacija.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/siuntiniai.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/taisykles.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/kontaktai.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/parama.png" border="0"> </a>
       <a href="index.html" target="_blank"><img src="images/reklama.png" border="0"> </a>

   </div>

 

nepadeda, kaip yra tas tarpelis taip yra..

zodziu pirma tau reikia gerai pasimokyti kodavimo ir karpymo. bent jau kol nenuejai sunkeliais. www.e-grafika.lt ten rasi puikiu pamoku pradedantiesiems su dizaino paisymu, jo sukarpymu ir sukodavimu. po to nebereikes klausineti tokiu klausimu. sekmes.

Visų pirmą, tai ne taip išvis reiktų deliot navigaciją.

Teisingas ir semantiškas mark-up'as atrodytų štai taip:

<ul id="topnav">
 <li><a href="#" title="title">lorem</a></li>
 <li><a href="#" title="title">ipsum</a></li>
 <li><a href="#" title="title">dolor</a></li>
 <li><a href="#" title="title">sit</a></li>
 <li><a href="#" title="title">amet</a></li>
</ul>

neveikia, nes po paveikslėlio kodu tarpą palieki... čia tas pats kas po žodžio tarpą palieki ir nori kad tie žodžiai nebūtų atskirti tarpu

o šiaip tai tikrai galėtum daryt su <UL> funkcija.