postavitev izdelkov

9 naročnikov

mi lahko kdo pomaga rešiti naslednji primer KLIKNI
Artikle bi rad postavil v vrsto. Težava se pojavi v primeru, ko je opis artikla daljši in se pri tem spremeni višina.
Ne bi rad reševal z fiksno višino, ker so opisi artiklov različno dolgi.

Postavitev izdelkov je v obliki <ul><li>izdelek 1</li> <li> izdelek 2</li></ul>

že v naprej hvala

ul.Otherproducts li {
width: 150px;
list-style-type: none;
margin-right: 15px;
float: left;
display: inline-block;
border: 1px solid #999;
margin-bottom: 15px;
height: 230px;
}

...... :)

EDIT: Se opravičujem, sem spregledal stavek o fiksni višini.

Tole dodaj med vrstice:

<div style="clear:both;"><!-- --></div>

Na vsake 4 daj en <div> okoli

po vsakem 4. li elementu narediš nov ul, torej:

<ul>
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<ul>
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<ul>
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>

Bi se pa dalo rešiti tudi s kakšnim Equal height pluginom za jQuery pomoje

@komac - div je treba nardit da kontejna vsak <ul>

glede na velikost artiklov imaš optimalno 4 <li> v 1 vrstici (<ul>) znotraj <div>
ko boš naložil te 4 <div> v contejner boš imel lepo "grid" mrežno 4x4 prikaz artiklov.

prikaz podrobnosti posameznega pa popout window ali znotraj 4x4 grid-a.

da ne pozabim, veliko šminke bo treba v CSS dodat.

lp

a lahko napišeš kako si si ti zamislil, ker če sem razumel kaj Robi rabi, ne rabiš nobenih divov tukaj vmešavat.. Se da samo z UL in LI rešit..

primer

nekaj v tem smislu...

Ena od opcij je tudi http://masonry.desandro.com/ .

@s1l3 - kul zadevca, všeč

nevem zakaj bi moral dodajati ul-je ali dive? Pusti tako kot si naredil in prilepi css kodo:
ul.Otherproducts li {
width: 150px;
list-style-type: none;
margin-right: 15px;
float: left;
display: inline-block;
border: 1px solid #999;
margin-bottom: 15px;
display: inline-block;
vertical-align: top;
zoom: 1; display: inline; /fix IE7*/
}