| Autor | Zpráva | ||
|---|---|---|---|
| Dealer DK Profil |
#1 · Zasláno: 30. 9. 2006, 08:09:10
Zdravím lidičky, taky sem lezu kvůli problemu a to asi dost dětinským jak dát stránku na střed pomoci css?
Využitý top mi nepomohlo nepřetahlo vše na ten střed. Potřeba aby pomoci třeba :center vše od hlavy až po patu. Děkuji. |
||
| netcoop Profil |
#2 · Zasláno: 30. 9. 2006, 09:37:33
Jako pro začátečníka ještě před rokem to byl pro mně taky obrovský problém, ale teď používám tohle:
HTML: ***samozřejmě napojení na styl*** <div id="global">obsah centrovaného boxu</div> CSS: #global { width: 770px; - šířka boxu (určitě sudé číslo, pak by se blbě dělilo dvěma) position: absolute; - musí být absolute (TEDY MYSLÍM) left: 50%; - tohle určuje, že má být vzdálenost 50% boxu na středu margin-left: -385px; - sem vypočítej polovinu width (polovinu 770px) } Není zač. Je to validní a funguje to ve všech prohlížečích zcela stejně. Můj výmysl. |
||
| Timy Profil |
#3 · Zasláno: 30. 9. 2006, 09:46:16
netcoop
zkus tohle: #global{ width:770px; margin:auto; } Funguje ve všech prohlížečích, akorát IE musí být ve standardu (jinak je potřeba ještě jeden element navíc). Jinak zkus si v prohlížeči zmenšit šířku okna na 500px, nejspíše se nedostaneš na celou stránku. |
||
| Miloš Profil |
#4 · Zasláno: 30. 9. 2006, 10:04:35 · Upravil/a: Miloš
Už to tu bylo několikrát. Takže:
Netcopův výmysl možná funguje, ale lze to i bez absolutního pozicování. Timyho verzi jenom jemně doladíme, aby fungovala i ve starých explorerech (respektive i v IE6, pokud je v quirku): 1) Prvku #global opravdu musíme nastavit konkrétní šířku; těch 770 (já bych dal 780, ale to je už detail) myslí na návštěvníky se staršími monitory (rozlišení 800*600) 2) margin: auto, respektive margin: něco auto něco auto – tedy automaticky vypočítaný levý a pravý okraj současné prohlížeče pochopí tak, že jsou oba okraje stejné, v čehož důsledku se prvek #global ocitne kýženě uprostřed. 3) Ne tak starší explorery – ty to hodí doleva. Pro ně je proto třeba navíc připsat dvě pravidla, která ostatním prohlížečům nikterak nepřekáží (za předpokladu, že <div id="global"> následuje hned za <body>, tedy že obaluje celou stránku): body: {text-align: center;} #global {text-align: left;} --------------------------- Celý zápis tedy bude vypadat následovně: body {text-align: center;} #global {width: 780px; margin: auto; text-align: left;} A jestliže chceš mít nějaký horní či dolní margin, můžeš poupravit třeba margin: 10px auto; nebo margin: 0 auto 15px auto;. --------------------------- Snad je to srozumitelné. |
||
| netcoop Profil |
#5 · Zasláno: 30. 9. 2006, 13:26:34
Zbytečný, proč tam nastavovat center a pak ho rušit. To moje je logičtější. To může rovnou uzavřít global do <div align="center"> a pak v global nastavit text-align: left. Tohle je profesionálnější. Nevím co komu vadí na absolutním pozicovaní.
|
||
| Timy Profil |
#6 · Zasláno: 30. 9. 2006, 13:36:09
netcoop
Profesionálnější...? Hmmm.... A proč na téhle stránce při menším rozlišení (třeba šířka 400) nevidím text vlevo? |
||
| Miloš Profil |
#7 · Zasláno: 30. 9. 2006, 13:44:19
netcoop
Jestli vidíš profesionalitu v tom, že jsi použil složitější konstrukci, nevím nevím. Pokud budu pořebovat uvnirř tohoto (pozicovaného) bloku další pozicování, obtékání… nechci vidět, co z toho ten který prohlížeč udělá. Řekl bych, že výpočet auto okrajů nebo nějaké text-align je na formátování jenoduché. Pokud se můžu takto vyhnout pozicování, rád to udělám. |
||
| Miloš Profil |
#8 · Zasláno: 30. 9. 2006, 13:50:12
Timy
A proč na … při menším rozlišení (třeba šířka 400) nevidím text vlevo? Protože bylo použito profesionálnější řešení, ne? |
||
| Dero Profil |
#9 · Zasláno: 30. 9. 2006, 13:53:50
A proč na … při menším rozlišení (třeba šířka 400) nevidím text vlevo?
Profesionálové používají vysoká rozlišení. :o) |
||
| Miloš Profil |
#10 · Zasláno: 30. 9. 2006, 13:56:16
Dero
Profesionálové používají vysoká rozlišení. :o) Vzal's mi to z pusy, jen jsem nechtěl být tak sarkastický. |
||
| Dero Profil |
#11 · Zasláno: 30. 9. 2006, 13:59:17
Miloš
Vzal's mi to z pusy, jen jsem nechtěl být tak sarkastický. A to mně zase nečiní nejmenší problém. Ona ta Timyho poznámka byla jasná nahrávka na smeč. |
||
| Timy Profil |
#12 · Zasláno: 30. 9. 2006, 14:02:21
Dero
Rádo se stalo :o) |
||
| ash721 Profil |
#13 · Zasláno: 30. 9. 2006, 15:01:18
Já ještě doplním drobnost..
Zmiňovali jste tady šířku 770px, později někdo zmínil dokonce 780px. Pokud Vám jde o optimalizaci pro rozlišení 800x600, pak obě možnosti jsou moc velké. (Taky by se mi líbilo mít více prostoru :)), ale pokud se chcete vyvarovat horizontálního posuvníku, doporučuju jako hranici používat 762px. |
||
| Dero Profil |
#14 · Zasláno: 30. 9. 2006, 15:05:26
Pokud Vám jde o optimalizaci pro rozlišení 800x600, pak obě možnosti jsou moc velké. (Taky by se mi líbilo mít více prostoru :)), ale pokud se chcete vyvarovat horizontálního posuvníku, doporučuju jako hranici používat 762px.
Ahoj ashi, dlouho jsme se nepotkali. :o) Proč 762px? Který z prohlížečů má vertikální posuvník široký 38px? Mně osobně se osvědčila hodnota 774px. Málokterý posuvník je širší než 22px + nějaká ta rezerva pro atypické potvory. |
||
| Anonymní Profil * |
#15 · Zasláno: 30. 9. 2006, 16:11:11
Ahoj Dero :), Rád tě vidím!
Zapomínáš, že oněch 38px není určeno jen pro posuvník, ale taky pro border prohlížeče.. ten má většinou 4px na každé straně, Takže z tohohle čísla musíš odečíst minimálně 8. O další 1px na každé straně je odsazený i samotný posuvník. Takže nakonec mě zbývá 28px, tobě tam zbyde 16px, přitom pokud se nemýlím, výchozí velikost posuvníků v xp je 17px. Nicméně hlavní důvod, proč používám 762 místo původních 764, které jsem používal, je ten, že jsem se tím několikrát setkal v praxi. Uznávám, že uživatel měl možná trochu upravené nastavení, nicméně nebyl to žádný extrém který bych chtěl ignorovat, takže jsem si dal rezervu. Od té doby na svých webech horizontální posuvník nevídám. :) Možná už jsem staromódní a možná od dob rolovátka na myši nikdo s velikostí posuvníku nehýbe, ale těžko to zjistit když jsem se na oněch 762 fixoval už před pár lety. Pokud jsi se s tím nesetkal, budu se snažit tvůj web nachytat v praxi :) |
||
| ash721 Profil |
#16 · Zasláno: 30. 9. 2006, 16:12:55
Pardon, zapoměl jsem se zalogovat.. Předchozí příspěvek je samozřejmě ode mne.
|
||
| Dero Profil |
#17 · Zasláno: 30. 9. 2006, 16:21:28
Zapomínáš, že oněch 38px není určeno jen pro posuvník, ale taky pro border prohlížeče.. ten má většinou 4px na každé straně
Tady je zakopán pes! Nevím z hlavy, jak tomu je v MAC OS nebo linuxových distribucích (nikdy jsem si této "nepodstatnosti" nevšiml), ale ve windows nemá prohlížeč v maximalizovaném stavu žádný border. A poměrně by mě překvapilo, kdyby v jiných systémech měl. Poradí někdo zkušenější? |
||
| ash721 Profil |
#18 · Zasláno: 30. 9. 2006, 16:41:01
Máš pravdu, v maximalizovaném okně se ve windows border nezobrazuje. Taky nevím jak je to na jiných systémech, ale to maximalizovaný okno není samozřejmostí. když si ho zmenším, a předtím nemám ručně zmenšené jiné okno, zmenší se mi jen do takového rádoby maximalizovaného stavu, tedy přes celou obrazovku, ale s borderem. Což se dá běžně přehlídnout a nemusí být důvod okno maximalizovat. Pak, aniž bych si to musel uvědomovat, můžu brouzdat v nemaximalizovaném okně s borderem. Řekl bych, že pravděpodobnost týhle situace je docela vysoká.
|
||
| netcoop Profil |
#19 · Zasláno: 30. 9. 2006, 18:41:32
V FF má u prohlížeče 5px na levo (srolovaný levý panel) a posuvník.
|
||
| Dealer DK Profil |
#20 · Zasláno: 2. 10. 2006, 23:13:34
LIDY diky :D
Ten nápad netcoopa sem nějak využil jen sem si to trochu při vylepšil o par scriptu pro sebe. Pokud budete takové diskuze rozvýjet tak vam jen budu děkovat :)) --Dik DIk Thx |
||
|
Časová prodleva: 18 let
|
|||
Toto téma je uzamčeno. Odpověď nelze zaslat.
0