Téma: Css táblázat, 2 oszlopos

Van egy problémám, amire már nagyon rég óta nem jöttem rá, egyszerűen nem tudom kiokoskodni.

Hogyan lehet azt megoldalni, hogy egy valamilyen lista 2 hasábban jelenjen meg?

Tehát pl. adott egy wordpress, és ki akarom mondjuk listázni a kategóriákat, és azt szeretném elérni, hogy azok 2 oszlopban jelenjenek meg. Mit kell ehhez a css file-ba beírnom?

A táblázatos cím onnan ered, hogy ezt a megoldást a phpld táblázattal csinálja, de egyszerűen nem tudok rájönni, hogy hogyan. A phpld-ben ugye be lehet állítani, hogy hány oszlopba listázza a kategóriákat, és az úgy is van. De hiába nézem a css-t, nem látok erre utaló kódot, vagy nem értek hozzá. És már a falat kamarom, hogy egy ilyen egyszerű dolgot nem bírok megcsinálni.

Manuálisan persze egyszerű, mert létrehozok egy 2 oszlopos táblázatot, és felviszem kézzel az adatokat.

De hogyan megy ez akkor, amikor adott egy lista, ami folyamatosan változik, bővül, mint pl a wordpress kategóriái, és azt akarom, hogy egyszer kelljen megírni a kódot css-ben, és mindig 2 oszlopban legyen a lista?

Remélem érthető voltam, és segít valaki nekem, mert már hülyét kapok

Üdv.: Arni

---

Hasonló témák:

• Táblázat vagy CSS DIV ?
• Táblázat
• szavazás blogspothoz több oszlopos válasszal
• A PageRank ( PR ) táblázat
• táblázat nélküli oldalfelépítés

Float az a divekhez és persze a többi html elementhez rendelhető stílus attribútum, amivel a körbefuttatás szabályozható.
http://www.w3schools.com/css/pr_class_float.asp

djarni eredeti hozzászólása

A css3-at támogatják a böngészők?

Na most megfogtál.. Firefox úgy tudom igen (már régóta, ha minden igaz), az új Safarik is, és tán az IE 8 is.

update: most úgy olvasom, hogy az IE 8 még mindig nem támogatja:
http://techblog.procurios.nl/k/618/n...eb-Design.html

Ha jól értelek, akkor egy egyszerű lista elemet szeretnél táblázatszerűen megjeleníteni, tehát úgymond tableless, azaz táblázat készítése nélkül szeretnél adatokat táblázatszerűen megjeleníteni . Ehhez nem kell CSS3. Csináltam egy gyors verziót belőle, hogy én hogyan szoktam. A megfelelő szemléltetés kedvéért ez egy 4 oszlopos és két soros táblázatnak felel meg. Nyilván egyéb jellemzőket is hozzá tudsz adni a css-hez, mint pl. keret, stb., hogy végképp úgy nézzen ki, mint egy táblázat. Bocsi, hogy egybe van ömlesztve a css a html-lel, de gondolom érthető, persze, ha egyáltalán erre gondoltál .

Kód:

<style type="text/css">
<!--
.list { }
.list ul { }
.list ul li { display: inline-block; }
* html .list ul li { display: inline; }
* + html .list ul li { display: inline; }
-->
</style>
<div class="list">
      <ul>
           <li>1. lista elem</li>
           <li>2. lista elem</li>
           <li>3. lista elem</li>
           <li>4. lista elem</li>
      </ul>
      <ul>
           <li>5. lista elem</li>
           <li>6. lista elem</li>
           <li>7. lista elem</li>
           <li>8. lista elem</li>
      </ul>        
</div>