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
float:left
/*vagy*/
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?
<style type="text/css">
.doboz {float:left}
.centerer {margin-left:auto;margin-right:auto;width:500px}
</style>
<body>
<div class="centerer">
<div class="doboz">dfgdg fd gdf d </div>
<div class="doboz">dfgdg fd gdf d fhfh</div>
</div>
</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
<style type="text/css">
.doboz {
	float: left;
	border-style: dotted;
	border-width: 1px;
}
.centerer {
	clear: both;
	overflow: visible;
	margin-left: auto;
	margin-right: auto;
	border-style: solid;
	border-width: 1px;
}
</style>
</head>
<body>
<div class="centerer">
<div class="doboz">dfgdg fd gdf d </div>
<div class="doboz">dfgdg fd gdf d fhfh</div>
</div>
</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