ugrás a tartalomhoz

Blokk típusú elemek egy sorban való megjelenítése

Anonymous · 2006. Aug. 24. (Cs), 00.54
Szervusztok!

Block típusú elemeket egy sorban jelenítenék meg. Mi ennek a legegyszerűbb módja? Jelenleg úgy oldom meg, hogy egy táblázat egy sorban lévő celláiba helyezem őket külön-külön. Ez túl nehézkesnek tűnik nekem szerintem ilyen egy soros táblázatnak nincs értelme mert átláthatatlanná teszi a kódot. :-( Van erre valami egyszerűbb megoldás?

Köszi a válaszokat!

--
sirkalmi
‹ Footer, az oldal alján kevés taralom esetén is AJAX hozzáférés megtagadva hiba ›
 ■
1

Float

sly · 2006. Aug. 24. (Cs), 02.13
  1. float:left  
  2. /*vagy*/  
  3. float:right  
2

Köszi!

Anonymous · 2006. Aug. 24. (Cs), 02.17
Látom nem csak én huhogok még ilyenkor. :-)
Köszi holnap kipróbálom! Ha ez beválik akkor nem kevés kódot törölhetek! :-)

--
sirkalmi
3

aztán ezek alá

toxin · 2006. Aug. 24. (Cs), 09.11
<div style="clear:both"></div> különben fx alatt lesznek huhogások :)
4

height

ashnur · 2006. Aug. 24. (Cs), 09.30
attol fugg mit akar. nem mindig kell ez. van amikor eleg megadni a heightet.
5

tény

toxin · 2006. Aug. 24. (Cs), 09.52
akkor adok inkább linket, ha galériát pl.

http://css.maxdesign.com.au/floatutorial/tutorial0407.htm
6

Pont ez kell nekem!

Anonymous · 2006. Aug. 24. (Cs), 16.37
Pont ez kell nekem azzal a különbséggel, hogy a Caption helyére nem szöveg hanem további blokkos elemek kerülnek. Kis ikonokat ábrázoló linkek.
Holnap nyitnak a könyvtárak aztán kiveszek már valami CSS könyvet. Nemtudom milyen műsor ez, hogy hónapokra lehúzzák a redőnyt csak mert szépen süt a nap. :-(

Köszi!
--
sirkalmi
7

miért is kell hozzá könyvtár?

toxin · 2006. Aug. 24. (Cs), 17.20
http://htmlinfo.polyhistor.hu/css_new/cssmain.htm
http://weblabor.hu/cikkek/cssalapjai1
http://www.prog.hu/cikkek/907/Bevezetes+a+CSS+alapjaiba.html

így hirtelen :)
8

Hasznos linkek

sirkalmi · 2006. Aug. 24. (Cs), 19.38
Hát ezek igen hasznos linkek voltak köszi! Főleg az első de azért egy jó könyv nem helyettesíthető semmivel. Én legalábbis jobb szeretek hosszabb szövegeket papírról elolvasni.

--
sirkalmi
9

én nem szeretem a könyveket

toxin · 2006. Aug. 24. (Cs), 19.51
annyira, nem lehet a bennük lévő példát a gyakorlatban kipróbálni és játszogatni velük (ekkor rögzülnek a legjobban bennem), ezért érzem pl. nagyon jónak a http://www.w3schools.com/css/default.asp
-módszerét

üdv t
10

doboz mérete

sirkalmi · 2006. Aug. 25. (P), 00.14
Létrehoztam egy dobozt a <div></div> -el és pakoltam bele blokkos elemeket a float: left; -el. A gondom az, hogy nem veszi fel automatikusan a belepakolt elemek méretét. Márpedig fontos volna, hogy mindig pont akkora legyen mint a belepakolt elemek együttes mérete mert ezt az egészet a képernyő közepáre szeretném mozgatni és ha kézzel állítok be valami fix méretet de nem pont akkora mint a benne lévők együttes mérete akkor azok már nem lesznek középen hanem attól balrább fognak elhelyezkedi.
Rövidebben:
Hogyan lehet blokkos elemeket egy sorba és horizontálisan középre helyezni táblázat használata nélkül?

Válaszokat nagyon köszönöm!

--
sirkalmi
11

Hmm

sirkalmi · 2006. Aug. 25. (P), 01.15
Hmm, ha a befogadó doboznak is megmondom, hogy float: left akkor felveszi a méretét a benne lévő dolgoknak de ezek után meg, hogy mondom meg, hogy középre kerüljön?

--
sirkalmi
12

Ez?

sly · 2006. Aug. 25. (P), 02.01
Erre gondolsz?
  1. <style type="text/css">  
  2. .doboz {float:left}  
  3. .centerer {margin-left:auto;margin-right:auto;width:500px}  
  4. </style>  
  5. <body>  
  6. <div class="centerer">  
  7. <div class="doboz">dfgdg fd gdf d </div>  
  8. <div class="doboz">dfgdg fd gdf d fhfh</div>  
  9. </div>  
  10. </body>  
13

Igen

sirkalmi · 2006. Aug. 25. (P), 02.36
Igen erre. Ugye az a gond, hogy az 500px széles centerer kerül középre nem pedig a tartalma ami annál kevesebb. A gond az, hogy dinamikus tartalomról van szó így változó szélességű és mindig középen kéne lennie.
Itt van amiről beszélek. A képek felett és alatt lévő lapozó sávról van szó. Jelenleg táblázattal van megoldva és működik, lecserélni csak azért akarom mert egyrészt éghetetlen vágyat érzek, hogy megtanuljam a CSS-t meg nem mindegy, hogy mennyi table tr td közt kell túrkálnod a kódban. :-)
Ugye a szóban forgó lapozó sáv szélessége változik annak függvényében, hogy hány kép van a rendszerben. A kép alatt lévő kis ikonok is táblázattal voltak a kép alá téve de ezt sikerült lecserélni. Ez csak akkor látszódik, ha bejelenkezel: pw: qwqwqwqw már, ha érdekel :-)

--
sirkalmi
14

középre

Anonymous · 2006. Aug. 25. (P), 12.18
a befoglaló divet ne floatold inkább adj egy clear: both; és egy overflow: akármi értéket, akkor együtt nő a tartalommal, ezután adsz neki egy margin: 0 auto; -t és középre lesz igazítva.

ha erre gondoltál.

ui: sztem lapozót lehet hagyni táblába is ha nagyon nem megy máskép.
15

Erre gondoltál?

sirkalmi · 2006. Aug. 25. (P), 13.03
  1. <style type="text/css">  
  2. .doboz {  
  3.     float: left;  
  4.     border-style: dotted;  
  5.     border-width: 1px;  
  6. }  
  7. .centerer {  
  8.     clear: both;  
  9.     overflow: visible;  
  10.     margin-left: auto;  
  11.     margin-right: auto;  
  12.     border-style: solid;  
  13.     border-width: 1px;  
  14. }  
  15. </style>  
  16. </head>  
  17. <body>  
  18. <div class="centerer">  
  19. <div class="doboz">dfgdg fd gdf d </div>  
  20. <div class="doboz">dfgdg fd gdf d fhfh</div>  
  21. </div>  
  22. </body>  
Nem akarja felvenni a centerer a doboz méretét. Sokat kísérleteztem és arra jutottam, hogy csak akkor veszi fel, ha azt is float: left -re állítom de ilyenkor meg nem foglalkozik a margin-left: auto; margin-right: auto; értékekkel. :-(

--
sirkalmi
16

igen

Anonymous · 2006. Aug. 25. (P), 14.21
pontosítok, overflonak auto-t adj, és felveszi.
17

Most se...

sirkalmi · 2006. Aug. 25. (P), 16.56
Azt hittem, hogy az overflow: auto az alapértelmezett de úgy tűnik nem. No megadtam és a doboz magasságát felvette a centerer viszont a szélességét nem hanem elfoglalja a teljes rendelkezésére álló területet. :-(
Itt megnézhető.

--
sirkalmi