| Autor | Zpráva | ||
|---|---|---|---|
| radim24 Profil * |
Ahoj,
mohl by mi někdo poradit proč se mi pravý sloupec nezarovnává doprava vedle levého sloupce? Dík <div id="content"> <div id="main" class="column_MR_M"> <div id="right" class="column_MR_R"> http://web-design.rozhled.cz/test/index.php?id=fotoalbum_preview&dir=maternity&sub=19th |
||
| panther Profil |
#2 · Zasláno: 28. 5. 2009, 10:01:41 · Upravil/a: panther
radim24
Nějak se v těch tvým <div>ech ztrácím.. Máš u toho levého sloupce levý float, nepřebývá ti tam cleaner? |
||
| radim24 Profil * |
float:left; tam není úmyslně.
Viděl jsem na netu příklad pomocí DIV, kde jsou tři sloupce: 1. float:left; 2. float:none; 3. float:right; když jsem tu jejich stránku upravil, tak jsem měl sloupce: 1. float:none; 2. float:right; a fungovalo to. Tak jsem se to pokusil napodobit. Teoreticky je to velmi snadné. To samé vlastně funguje i na Benčíkovu weblogu: http://bencik.ic.cz/bw2.html kde sloupec hlavičky: Nejčtěnější * Lorem ipsum dolor sit amet - 22.9.2008 * Phasellus sapien nibh ultricies - 22.9.2008 * Consectetuer adipiscing elit - 22.9.2008 * Duis ut lorem eu sem venenatis - 22.9.2008 * Lorem ipsum dolor sit amet - 22.9.2008 je posunut doprava pomocí float:right; takže proto tam float left nenajdeš. Nemohu tam float left použít protože to chci centrovat. |
||
| tiso Profil |
#4 · Zasláno: 28. 5. 2009, 10:21:38
radim24 - centrovanie sa robí inak...
|
||
| SwimX Profil |
#5 · Zasláno: 28. 5. 2009, 10:24:30
radim24
Nevím jak je řešen Benčíkův weblog, ale proč to neudělat nějak takle:
<style> h1{float:left; width: 500px;}
p{float:right: width: 200px;}
.cl{clear: both;}
</style>
<h1>Nadpis</h1><p>Ten text co chces mit vpravo<p>
<br class='cl'> |
||
| radim24 Profil * |
tiso
Vím jak se dělá centrování, mám to na web-design.rozhled.cz. Tělo stránky je centrované a pak se vloží DIV se zarovnáním doleva. SwimX Te´d jsem to psal, že nemohu použít float left; Levý sloupec musí být centrovaný. |
||
| SwimX Profil |
#7 · Zasláno: 28. 5. 2009, 10:35:39 · Upravil/a: SwimX
radim24
<style>
body{text-align: center;}
#main{margin: 0 auto; width: 760px; text-align: left; background: grey;}
h1{float:left; width: 500px; background: red;}
p{float:right; width: 200px; background: green;} /* edit: chyběl mi středník */
.cl{clear: both;}
</style>
<div id="main">
<h1>Nadpis</h1><p>Ten text co chces mit vpravo<p>
<br class='cl'>
</div> |
||
| panther Profil |
#8 · Zasláno: 28. 5. 2009, 10:36:09
radim24
„Vím jak se dělá centrování, mám to na web-design.rozhled.cz... ...Levý sloupec musí být centrovaný.“ teď ani nevím, co je tvým cílem. Víš, ale nevíš, jak se centruje, víš, ale nevíš, co chceš. Zkus se vyjádřit nějak pořádně ;-) |
||
| radim24 Profil * |
#9 · Zasláno: 28. 5. 2009, 10:51:51
Tak to zkusím znovu.
Jediné co na těch stránkách má floutovat (floatovat) je ten pravý sloupec doprava. V levém sloupci mají být ikony. V závislosti na nastavení stránek tam budou buď dvě ikony nebo tři ikony v jednom řádku. Vlastně jde o sloupce ikon, podobně jako tady na těchto stránkách: http://www.encyklopediepsu.cz/ kde v levém sloupci "Řazeno dle abecedy" jsou ikony s popiskama po sloupcích. Jediný rozdíl mezi touto stránkou a tomu mou je, že v mém případě levý sloupec s obrázkama má být šiřší a nepoužívá se tam padding. Díky tomu, že je levý sloupec široký se budou sloupce centrovat na střed a nepotřebují padding. A abych to mohl vycentrovat, tak ten levý sloupec nesmí plavat. Plavat bude pravý sloupec a te´d bych rád našel na internetu nějaký příklad.... |
||
| tiso Profil |
#10 · Zasláno: 28. 5. 2009, 10:57:52
radim24 - obrázok je niekedy viac ako tisíc slov, tak to skús nakresliť ako to vlastne chceš.
|
||
| radim24 Profil * |
#11 · Zasláno: 28. 5. 2009, 10:59:13
nakreslit bych to mohl, ale teď je obsazený scaner
|
||
| SwimX Profil |
#12 · Zasláno: 28. 5. 2009, 11:37:14 · Upravil/a: SwimX
radim24
takle nějak? http://plaveckyoddil-st.czechian.net/info/ondra/Novy3sss.php nebo možná's to myslel ještě takle: http://plaveckyoddil-st.czechian.net/info/ondra/Novy3sss2.php |
||
| Radim24 Profil * |
http://web-design.rozhled.cz/test/pic.jpg
A aby jste viděli, že to jde: http://web-design.rozhled.cz/test/right.htm (levý nepluje) SwimX ad http://plaveckyoddil-st.czechian.net/info/ondra/Novy3sss.php NE. http://plaveckyoddil-st.czechian.net/info/ondra/Novy3sss2.php SKORO TREFA. JEŠTĚ MI PROSÍMTĚ VYCENTRUJ TY TŘI SLOUPCE, ABY BYLY UPROSTŘED A NEPOUŽÍVEJ K TOMU MARGIN. Mě se to jednou povedlo pomocí width:číslo%; teda v mém případě to bylo mezi 2- 10% v závislosti na šířce rodiče. No, ale nevěděl jsem zda je to spolehlivé a pak chtěl jsem to zkusit centrovat stejně jako tady: http://web-design.rozhled.cz/test/right.htm (příjde mi to jako nejelegantnější řešení) Oprava: NEPOUŽÍVEJ K TOMU PADDING |
||
| tiso Profil |
#14 · Zasláno: 28. 5. 2009, 14:10:59
Radim24 - v tom tvojom príklade „že to jde“ ti chýba to vycentrovanie...
|
||
| Radim24 Profil * |
tiso
Ten příklad zachycuje pouze ten float:right; to byl příklad, abych vystihl tu podstatu uspořádání. Tam je nejpodstatnější to, že ty DVA DIVY JSOU VEDLE SEBE ANIŽ BY TEN LEVÝ PLUL. TO NA MÉM TESTU http://web-design.rozhled.cz/test/index.php?id=fotoalbum_preview&dir=maternity&sub=19th NEJDE. tak bych byl rád, kdyby jste přišli na to, kde je ta chyba. To vycentrování budu řešit pak. |
||
| Chamurappi Profil |
#16 · Zasláno: 28. 5. 2009, 14:31:15
Reaguji na Radima24:
NEPIŠ se zapnutým CAPS LOCKem a nedávkuj své reakce do několika po sobě odeslaných příspěvků. Pokud potřebuješ dodatečně doplňovat své příspěvky, zaregistruj se a získáš možnost je měnit i po odeslání. Dej <div id="right"> před <div id="left"> a budou vedle sebe. Chceš-li sloupce skládat zleva vedle sebe, dej jim všem „float: left“. |
||
| tiso Profil |
#17 · Zasláno: 28. 5. 2009, 16:12:31
Aha, takže celé toto tu je len o tom, že v tom pokusnom fotoalbume bolo prehodené poradie divov? Pekné nedorozumenie :-)
|
||
| Radim24 Profil * |
#18 · Zasláno: 28. 5. 2009, 17:13:53
Chamurappi
Tak dík. Vyzkouším tvou radu. tiso Jak to bude hotové zašlu odkaz :-) |
||
| Radim24 Profil |
#19 · Zasláno: 29. 5. 2009, 09:11:51 · Upravil/a: Radim24
Obsah jsem aktualizoval, a na první pohled to funguje, až na to, že ten pravý sloupec nedrží v tom DIV id=main. Posouvá se nahoru k okraji stránky. Nějaký nápad čím to může být?
http://web-design.rozhled.cz/test/index.php?id=fotoalbum_preview&dir=maternity&sub=19th Už jsem našel tu stránku, ze které jsem se insproval tím floatem right: http://knihy.cpress.cz/Pocitac/Book.asp?ID=1394 a tam je vidět, že jim to v tom hlavním DIVu drží. EDIT: Možná pomůže nastavit sjednocujícímu DIVU margin-top:15px; jdu to vyzkoušet. |
||
| panther Profil |
#20 · Zasláno: 29. 5. 2009, 09:29:22
Radim24
„až na to, že ten pravý sloupec nedrží v tom DIV id=main“ jak se může „držet“ divu#main, když je mimo něj? Tohle nějak nechápu. „Posouvá se nahoru k okraji stránky. Nějaký nápad čím to může být? “ divy s třídou „ico“ máš díky „cleaneru“ pod položkami „div#admin-menu“, kdežto pravý sloupec je „mezi“ nimi. |
||
| tiso Profil |
#21 · Zasláno: 29. 5. 2009, 09:43:13
Radim24 - pridaj prvok s clear za odkazy v hornom menu, alebo nechaj plávať aj ten div.
A máš tam 2x prvok s id="main", id musí byť na stránke jedinečné! |
||
| radim24 Profil * |
#22 · Zasláno: 29. 5. 2009, 10:04:38
panther
ad 1 - myslel jsem to opticky - jako že se chová jako by byl vyňat ad 2 - podívám se na to, díky tiso taky díky, zkusím co s tím zmůžu... |
||
| radim24 Profil * |
#23 · Zasláno: 29. 5. 2009, 15:27:56
trochu jsem změnil strukturu. DIV id=admin_menu jsem posunul pod DIV id=content. Na ten clear jsem nakonec přišel taky sám, když jsem měnil šířku admin menu tak to dělalo neuvěřitlené věci. Myslel jsem, že ty floutující prvky admin_menu a ico jsou na sobě nezávislé, protože jsou každý v jiném DIVU, úplně jinde a neměli by se ovlivňovat. Jenže jsou vyrtaženy z obsahu, takže obyčejný clear to řeší. Teda alespoň pro Firefox. Ale IE a Opera zase dělá něco jiného. Už jsem chtěl říct, že to vypadá pěkně...
|
||
| Radim24 Profil |
#24 · Zasláno: 29. 5. 2009, 15:33:22 · Upravil/a: Radim24
A to centrování id="middle" (levý sloupec) taky nefunguje... Čím to?
EDIT: V Opeře je zvoraný levý sloupec id="middle". Ten pravý sloupec se chová jako by floatoval doleva a nachází se vedle slova maternity (ale o řádek níž) (tj. první položka zleva DIV id=admin_menu). Zřejmě by to chtělo dát nějaký clear, ale to mi nefungovalo, protože když jsem tam dal clear tak pravý sloupec odjete pryč. |
||
| Radim24 Profil |
#25 · Zasláno: 29. 5. 2009, 15:41:14
Nejde mi to podruhé zeditovat, tak dodatek:
Teď jsem si vzpomněl, že aby fungovalo centrování tam by měl být myslím v nadřazeném prvku nebo v tom aktuálním marfin:auto; takže to zkusím vycentrovat (i celou stránku). Ale s tím levým sloupcem nevím. |
||
| Chamurappi Profil |
#26 · Zasláno: 29. 5. 2009, 16:07:31
Reaguji na Radima24:
„Nejde mi to podruhé zeditovat“ Musíš trochu počkat. Dobrá finta také je: rozmyslet si, co všechno chceš napsat, pak to napsat (stručně a výstižně) a pak teprve odesílat. Většina lidí tu zvládá normálně přispívat, aniž by mačkala odesílací tlačítko po každém odstavci. Neorientuji se v tom, na co se ptáš a co ti vlastně nejde. |
||
| Radim24 Profil |
#27 · Zasláno: 30. 5. 2009, 09:45:37
SHRNUTÍ PROBLÉMU:
1) Stále nejde vycentrovat levý sloupec (DIV id=middle). A to ani když použiju margin:auto; To by způsobilo že se ty sloupce rozhodí úplně. 2) V Opeře to posouvá levý sloupec (DIV id=middle) o kus doprava, na úroveň toho odkazu "Maternity" v levém horním rohu. |
||
| psdad Profil * |
#28 · Zasláno: 31. 5. 2009, 21:56:12
zkus
<div id="content"> <div id="right" class="column_MR_R"> <div id="main" class="column_MR_M"> |
||
| Radim24 Profil |
#29 · Zasláno: 1. 6. 2009, 11:10:34
psdad
Ty navrhuješ přehození levého sloupce s pravým, ale to jsem už udělal... |
||
|
Časová prodleva: 15 let
|
|||
0