Autor | Zpráva | ||
---|---|---|---|
Carter Profil * |
#1 · Zasláno: 7. 12. 2008, 16:26:45
Zdravím! Mám problém s vycentrováním stránky; jak vycentrovat například tenhle příklad: http://www.jakpsatweb.cz/priklady/css-sloupce.html ? je tam všude position: absolute a já s tím nemůžu hnout ku středu.
|
||
mikul Profil |
#2 · Zasláno: 7. 12. 2008, 17:25:14
Obalovacímu DIVu dej position:relative a pak použijěš margin:auto. Pokud to teda nepotřebuješ absolutně.
|
||
kletely Profil |
#3 · Zasláno: 7. 12. 2008, 17:51:42
|
||
Carter Profil * |
#4 · Zasláno: 7. 12. 2008, 21:36:54
Konkrétně k mému problému: Potřebuji aby dva spodní sloupce byli vedle sebe, ale na středu stránky: potřeboval bych poradit s těmi absolute - relative, top - left. Ale aby to zároveň fungovalo i ve Firefoxu. Děkuji.
<html> <head> <meta http-equiv="Content-Language" content="cs"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> <title>pokus</title> <style> * {margin: 0px; padding: 0;} html, body {height: 100%;} body { position: relative; background: #ffffff; text-align: center; margin: 0 auto;} #head { position: relative; background: #087880; width: 760px; height: 130px; top: 0px; left: 0px; border: solid 2px #fbbfff; margin: 0 auto; } #levy { position: relative; background: #000000; width: 120px; height: 300px; top: 0px; left: 0px; border: solid 2px #fffbbf; color: red; margin: 0 auto;} #pravy {position: relative; background: #444444; width: 640px; height: 300px; text-align: center; top: 0px; left: 0px; border: solid 2px #bffffb; color: yellow; margin: 0 auto;} </style> <body> <div id="body"></div> <div id="head"></div> <div id="levy"></div> <div id="pravy"></div> </body> </head> </html> |
||
mikul Profil |
#5 · Zasláno: 7. 12. 2008, 21:54:04 · Upravil/a: mikul
body { position: relative; background: #ffffff; text-align: center; margin: 0 auto;} #head { position: absolute; background: #087880; width: 760px; height: 130px; top: 0px; left: 0px; border: solid 2px #fbbfff;} #levy { position: absolute; background: #000000; width: 120px; height: 300px; top: 130px; left: 0px; border: solid 2px #fffbbf; color: red;} #pravy {position: absolute; background: #444444; width: 640px; height: 300px; text-align: center; top: 130px; left: 120px; border: solid 2px #bffffb; color: yellow;} Zkus to nezkoušel jsem to snad tam není nějaký překlep. |
||
mikul Profil |
#6 · Zasláno: 7. 12. 2008, 22:00:47
Asi si budeš muset taky pohrát s border.. Každý prohlížeč to počítá jinak, nevím, jestli bude vidět když nebudou přesně sedět.
|
||
Carter Profil * |
#7 · Zasláno: 7. 12. 2008, 22:02:28
Jo to je téměř ono! Ještě malou radu jak to vycentrovat na střed
|
||
mikul Profil |
#8 · Zasláno: 7. 12. 2008, 22:20:06
Myslíš celý ten blok? Na střed by ti to mělo zarovnat to
margin:auto |
||
Carter Profil * |
#9 · Zasláno: 8. 12. 2008, 15:26:23
Ano, celý ten blok, ale ani v exploreru to není na středu. V čem je tedy problém?
|
||
Trejpa Profil |
#10 · Zasláno: 8. 12. 2008, 16:15:19
Carter
„V čem je tedy problém?“ V tom, že nečteš odkázané materiály. To, co má být uprostřed (asi všechno), obal jedním blokem s rozměry a jen ten vystřeď. |
||
Bubák Profil |
#11 · Zasláno: 8. 12. 2008, 16:15:30
„ V čem je tedy problém?“
http://diskuse.jakpsatweb.cz/index.php?action=vthread&forum=1&topic=86 130#2 Obalový DIV je kde? |
||
Carter Profil * |
#12 · Zasláno: 8. 12. 2008, 17:37:04
Tak všem děkuju za rady! Nakonec to všechno funguje jak má!
|
||
Časová prodleva: 17 dní
|
|||
Vodifone95 Profil |
#13 · Zasláno: 25. 12. 2008, 12:19:21 · Upravil/a: Vodifone95
Asi se ptám jak blbej, ale na mém webu http://www.b732.ic.cz/ si jeden návštěvník stěžuje, že nemám vycentrovaný web. Zkoušel jsem metodu kterou psali na http://tiso.wz.cz/articles/vycentrovanie-obsahu-stranky.php , ale pořád nic. Poradíte mi, jak to mám jednoduše udělat?
|
||
panther Profil |
#14 · Zasláno: 25. 12. 2008, 12:26:19 · Upravil/a: panther
Vodifone95
„si jeden návštěvník stěžuje, že nemám vycentrovaný web“ má na to právo, web je u levého kraje. „Zkoušel jsem metodu kterou psali na http://tiso.wz.cz/articles/vycentrovanie-obsahu-stranky.php , ale pořád nic.“ asi jsi zkoušel špatně. „Poradíte mi, jak to mám jednoduše udělat?“ v tak zpraseném kódu to bohužel jednoduše nepůjde. Alespoň já nemám během vánočních svátků nervy na prohrabování se v tvém kódu |
||
Vodifone95 Profil |
„má na to právo, web je u levého kraje.“
To je pro mě fakt novinka. :-/ Zkusil jsem to tedy jinak - někoho jsem se zeptal, a udělal jsem to takhle: (sice to není v CSS, ale pořád to není ono) <html> <head> <title> nadpis </title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> </head> <body> <table align="center" border="0"> <div style="float:left; width: 160px;"> levé menu </div> <div style="float:left; width: 614px"> obsah stránky </div> </table> </body> </html> Ujde to, ale blbne to na stránkách kde mám tabulku (není divu, když to je tabulka) a bůhvíproč to nefunguje v PHP. Takže mohl by sem někdo dát jednoduchý návd, jak to vycentrovat pomocí CSS? please |
||
panther Profil |
#16 · Zasláno: 26. 12. 2008, 16:56:42
Vodifone95
„Takže mohl by sem někdo dát jednoduchý návd, jak to vycentrovat pomocí CSS? please“ a copak jsi návod nedostal? (kletelyho příspěvek) |
||
Vodifone95 Profil |
#17 · Zasláno: 26. 12. 2008, 17:24:01
Zkusil, ale nepochopil.
|
||
Trejpa Profil |
Vodifone95
<html> <head> <title> nadpis </title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> </head> <body style="text-align: center;"> <div style="text-align: left; margin: 0 auto; width: 775px;"> <div style="float:left; width: 160px;"> levé menu </div> <div style="float:left; width: 614px"> obsah stránky </div> </div> </body> </html> |
||
Časová prodleva: 12 dní
|
|||
TTezz Profil * |
#19 · Zasláno: 7. 1. 2009, 19:03:53
Ahoj, přestože jsem zkoučela všechny vaše rady, jak mou stránku vycentrovat, tak žádný z nich nezabral. Nevím už, v čem dělám chybu...
</head> <body style="text-align: center;"> <div style="width: 760px; text-align: left; margin: 0 auto;"> <div id="zahlavi"> zahlavi .... </div> </div> |
||
tiso Profil |
#20 · Zasláno: 7. 1. 2009, 19:11:51
TTezz - bez zvyšného html a css môžem len hádať, skús
<div style="width: 760px; text-align: left; margin: 0 auto;position: relative;"> |
||
Tezz Profil * |
#21 · Zasláno: 7. 1. 2009, 19:25:56
Díky, už se to aspoň pohlo, ale špatným směrem.. no nemám to nikde na netu, takže se to asi bude upřešňovat hůř, to vím.. no jestli ti to pomůže, tak:
<head> <meta http-equiv="content-type" content="text/html; charset=windows-1250" /> <meta name="generator"/> <title></title> <link href="styly2.css" type="text/css" rel="stylesheet" /> <style type="text/css"> </style> </head> <body> <div id="all"> <div id="zahlavi"> <strong>Hlavní téma</strong> </div> .... a v CSS mám: body{ margin: 0 auto; position: relative; text-align: center; } #all{ left: 0px; width: 760px; text-align: left; margin: 0 auto; } |
||
Tezz Profil * |
#22 · Zasláno: 7. 1. 2009, 19:40:25
Tak už jsem do toho all připsala i tu pozici...už se to hýbe...ale zarovnání je v pravém horním rohu...i když nemám nikde nic zarovnané napravo...Zvláštní:-/
|
||
Trejpa Profil |
#23 · Zasláno: 7. 1. 2009, 19:44:40
Tezz
Chybí ti tam rozměr. <body style="text-align: center;"> <div style="text-align: left; margin: 0 auto; width: 775px;"> ... </div> |
||
Tezz Profil * |
#24 · Zasláno: 7. 1. 2009, 19:49:40
Mám ho tam..#all{
left: 0px; width: 760px; text-align: left; margin: 0 auto; } |
||
Měsíček Profil |
#25 · Zasláno: 7. 1. 2009, 19:50:42
Nemáš .. <div>, který Trejpa popisuje nemá id #all ;-)
|
||
Tezz Profil * |
#26 · Zasláno: 7. 1. 2009, 19:55:51
Nj, ale i když jsem to tam dala, má to stejný efekt...krásně se to přizpůsobuje při zmenšení stránky až na to, že je ten celý blok zarovnán doprava
|
||
tiso Profil |
#27 · Zasláno: 7. 1. 2009, 19:55:58
Měsíček - ak sa bavíme o [#21] tak má
|
||
Trejpa Profil |
#28 · Zasláno: 7. 1. 2009, 19:59:38
Tezz
„left: 0px; “je blbost, to se nepozicuje. Doporučuji ti pořádně (vícekrát) přečíst a vyzkoušet tisův návod a až ti bude fungovat (tj. napoprvé, pokud tam nic nezměníš a nepřidáš), tak teprve v něm dokonstruovat zbytek stránky. |
||
Tezz Profil * |
#29 · Zasláno: 7. 1. 2009, 20:03:39
Ten už jsem zkoušela..a kolikrát:(
Vím, že vám musím připadat jako úplný idiot a máte určitě svých problémů dost...no abych to upřesnila, teď to vypadá takhle a je to stejné.. <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250" /> <meta name="generator"/> <title></title> <link href="styly2.css" type="text/css" rel="stylesheet" /> <style type="text/css"> </style> </head> <body> <div id="all"> <div id="zahlavi"> <strong>Hlavní téma</strong> </div> .... a v CSS mám: body{ margin: 0 auto; position: relative; text-align: center; } #all{ position: relative; width: 760px; text-align: left; margin: 0 auto; } |
||
Tezz Profil * |
#30 · Zasláno: 7. 1. 2009, 20:05:56
Zkoušela jsem to u toho body s position: relative; i bez udání pozice, prozkoušela jsem snad z těch kombinací už všechno a furt mě nenapadá, čím to je..
|
||
Téma pokračuje na další straně.
|
0