| Autor | Zpráva | ||
|---|---|---|---|
| zuza Profil |
Dobrý den,
prosím o radu ohledně vycentrování celé stránky. Já vím, že už jsem asi 100 jubilejní člověk, který to nechápe, ale přes veškerou snahu a čtení těchto stránek ty svoje nemůžu dostat doprostřed prohlížeče, takže na velké obrazovce je to celé namáčklé vlevo, jak v IE, tak v Opeře, tak ve Foxu. Nevím, jestli to není mícháním absolutních a relativních pozic. Tady je kód: body {
text-align: center;
}
#all {
text-align: left;
margin: 0 auto;
}
#header {
top:0px;
position:relative;
width:955px;
height:149px;
background-image:url(../Bilder/header.jpg);
}
#banner {
position:relative;
top:10px;
width:950px;
height:15px;
border:groove; border-color:#669900;
text-align:left;
}
#navigace {
position:relative;
top:20px;
width:955px;
height:193px;
padding-top:5px;
}
#info {
position:relative;
top:20px;
width:250px;
height:416px;
}
#liste {
position:absolute;
width:700px;
height:23px;
margin:2px;
background-image:url(../Bilder/feilnavi.jpg);
background-repeat:no-repeat;
left: 251px;
top: 396px;
}
#container {
position:absolute;
left:263px;
top:432px;
width:583px;
height:397px;
background-repeat: no-repeat;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
text-align:left;
color: #000000;
font-weight: bold;
padding-left: 50px;
padding-right: 50px;
background-image:url(../Bilder/container.jpg);
} |
||
| Str4wberry Profil |
#2 · Zasláno: 15. 5. 2008, 17:09:05
Zuzo, zkus přidat position: relative pro #all.
|
||
| zuza Profil |
#3 · Zasláno: 15. 5. 2008, 17:19:51 · Upravil/a: zuza
Str4wberry.. přidáno a nic...
|
||
| Str4wberry Profil |
#4 · Zasláno: 15. 5. 2008, 17:31:44 · Upravil/a: Str4wberry
A přidej width (taktéž pro #all).
|
||
| vertigo4 Profil |
#5 · Zasláno: 15. 5. 2008, 17:32:52
zuza
já nevim, to position: relative; tam máš hodně zbytečně... odstraň ho + to dorovnej marginem či paddingem a pak ti to půjde bez problémů... |
||
| zuza Profil |
#6 · Zasláno: 15. 5. 2008, 17:37:40
vertigo4takže ještě blbá otázka: ty pozice tedy nemusí být zadané?
|
||
| zuza Profil |
#7 · Zasláno: 15. 5. 2008, 17:39:06 · Upravil/a: zuza
Str4wberry j
pro upřesnění - po tom přidání #all se to vycentrovalo v IE, Fox nereaguje. |
||
| zuza Profil |
#8 · Zasláno: 15. 5. 2008, 17:42:44
Str4wberry
v IE je vycentrovaný header a banner, s tím zbytkem budu muset něco udělat, ale Fox nereaguje. Nevíš proč? |
||
| kletely Profil |
#9 · Zasláno: 15. 5. 2008, 17:43:53
zuza
Možno že to to zaberie ale pochybujem. #all {
text-align: left;
margin: 0px auto;
width: xxxpx;
}Možno by si mohol povedať aj usporiadanie v HTML. |
||
| zuza Profil |
#10 · Zasláno: 15. 5. 2008, 17:48:01
vertigo4
Na blbou otázku si odpovím sama: nemusí. Margin a padding - to nebude problém. Jenom pořád nevím, proč Mozilla zatvrzele odmítá vycentrování... |
||
| zuza Profil |
#11 · Zasláno: 15. 5. 2008, 17:52:36
kletely nezabralo, ale dík.
|
||
| Lexter Profil |
#12 · Zasláno: 15. 5. 2008, 17:55:56 · Upravil/a: Lexter
body
{
text-align: center;
}
#all
{
margin: 0 auto;
width: 700px; // Kde 700 Nahradíš šířkou tak jak ji tam máš.
text-align: left;
}Není možná, aby nefungovalo. |
||
| Str4wberry Profil |
#13 · Zasláno: 15. 5. 2008, 18:26:31
Reakce na zuzu:
Ukaž živou ukázku. Povede to k rychlejšímu vyřešení. Reakce na Lextra: „Není možná, aby nefungovalo.“ Je. Protože absolutně pozicované části z toho <div>u „vyletí“. |
||
| zuza Profil |
#14 · Zasláno: 15. 5. 2008, 18:50:13
Str4wberry
ještě s tím něco udělám a zítra dám vědět, jak to dopadlo včetně ukázky. Zatím díky moc za pomoc :-)) |
||
| Trejpa Profil |
#15 · Zasláno: 16. 5. 2008, 02:09:24
zuza
Neznám sice pořadí a zanoření bloků v HTML kódu, ale po troše domýšlení jsem to splácal. Ve tvém kódu není třeba žádné pozicování, stačí jeden float. Přetékání dlouhých textu v FF nebude při nastavené výšce elementů pěkné, doporučuji vhodný overflow. Centrování bloků se provádí zápisem typu (šířka je důležitá): <body style="text-align: center;"> <div style="text-align: left; margin: 0 auto; width: 955px;"></div> Pozicování v rámci jednoho elementu se provádí tak, že se obalovému elementu nastaví position: relative;, všem vnitním position: absolute; a jejich pozice se počítá od levého horního okraje toho nadřazeného bloku: <div style="position: relative;"> <div style="position: absolute; top: 0; left: 0; width: 100%; height: 2em;">hlavička</div> <div style="position: absolute; top: 2em; left: 0; width: 20%; height: 30em;">navigace</div> <div style="position: absolute; top: 2em; left: 20%; width: 80%; height: 30em;">obsah</div> </div> Uvedené metody můžeš zkombinovat. takže ještě blbá otázka: ty pozice tedy nemusí být zadané? Ne. Přiřadíš-li elementu position relative nebo absolute a nezadáš-li hodnotu left/right a (nebo) top/bottom, je tato chápána jako nulová. kletely Možno že to to zaberie ale pochybujem. [...] margin: 0px auto; Hloupost. Nulové hodnoty v CSS lze zapisovat bez jednotky. |
||
|
Časová prodleva: 17 let
|
|||
0