Vystředění layotu pomocí divů

Mám problém, chtěl bych na stránkách vytvořit layout pomocí absolutně pozicovaných divů. Není to zas takový problém až do té doby když sem chtěl ten celý layout umístit na střed stránky. Napadlo mě dát umístění z leva tolik bodů aby to prostě bylo na středu, ale co ostatní rozlišení? Nevíte jak na to?

stránky: http://www.sekec.wz.cz
styly : http://www.sekec.wz.cz/styly.css

Ostatních věcí si nevšímejte zatím řeším jenom ten layot. Dík

Zavři všechny pozicované divy do divu (předpokládejme, že je označen id="centrovak"), a ten vycentruješ.

Vycentruješ ho takhle:
body {text-align:center} /* IE5 ignoruje margin:auto, ale tohle ho, diky dalsi jeho chybe, opravi */
div#centrovak {margin:0 auto; text-align:left; positin:relative} /* vycentrujes pro slusnejsi prohlizece + vratis text-align na puvodni hodnotu + zaridis, ze hodnoty absolutne pozicovanych prvku uvnitr se budou pocitat od jeho leveho horniho rohu, misto od rohu cele stranky */

Překlep: position:relative

ajo, to mě nenapadlo (mám v hlavě nějjak předivováno:), zkoušel sem to natvrdo rvat přes<center>, ale tam to narozilo na to pozicování. Dík

Proč mi to nefunguje?(jak firefox, tak ie)
Freya-máš to ozkoušený?
Odsadilo se mi to akorát kus od kraje.

To musí fungovat... Máš to někde na netu?

IMHO to má Freya dobře. Tady máš přímo kus kódu, kterej je vyzkoušenej.

body {text-align: center;}

div#page {
position: relative;
width: 760px;
height: 100%;
margin: auto;
}

Asi sem uplná lama, nebo newím. Chápu smysl toho, co by to mělo dělat, jenom nechápu proč to nefunguje na těch mejch stránkách...
Hodil sem to na web, tak na to pls mrkněte a řekněte mi kde mám chybu.

stránka: http://sekec.wz.cz/hlavni.htm
styly: http://sekec.wz.cz/styly.css

Asi to je blbost, ale zkus dát to body před ten centrovák... ale to je spíš blbost ;)

máš ty divy špatně zakončovaný

<div id="centrovak">
<div id="baner1"><img src="baner1.jpg">
<div id="akce">MMMMMMMMMMMMMMMMMMMMMMMMMM</div></div>

už tohle je blbost

ja mam celej body v divu a vypada to takhle:
<head>blabla</head>
<div style="width: 550px; position: relative; text-align: left; margin: auto; padding: 30px;">
<body>
blablablabla
</body>
</div>

centruje to 550px od okraju a kdyz zmensujes velikost okna tak se to chova krasne - nemeni se velikost toho "ramecku" ve kterym je obsah webu. a padding tam mam kvuli border. aby nebyl přilepenej přímo na ten div.

PS: nefunguje to v IE 5 a níž... ale to už je snad pasééé :)))

Mít body uvnitř divu je úplná zvrhlost a nemůžeš se divit, že si to prohlížeče vykládají po svém :-)

Na I.E. 6 + SP-1 mi funguje margin: auto; jen s plným DOCTYPE, (s odkazem na W3C) :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

freya: náhodou, abys vjjědjěla, mám to z jakpsatweb.cézet. takže si stěžuj Yuhůovi :)))

skaff >> A můžeš předvést link, odkud z jakpsatweb to máš? To mě zajímá :-)

http://www.jakpsatweb.cz/priklady/css-position-center.html

a máš to.

skaff: tam ale neni body v divu. tam je v body div a v nem je vsecko ostatni

> tam ale neni body v divu

body v divu ani bejt nesmi...

A nemám to ;-)

milster--
<div id="centrovak">
<div id="baner1"><img src="baner1.jpg">
<div id="akce">MMMMMMMMMMMMMMMMMMMMMMMMMM</div></div>

už tohle je blbost--

Co by na tom měla být blbost?Každej div mám normálně zakončenej</div>, jinak v páru sou všechny, to sem kontroloval.

tak jsem si dal tu práci a našel jsem to: hned v prvnim řádku souboru styly.css napiš místo toho co tam máš toto:
div#centrovak { margin: auto; text-align:left; position:relative}
Chyběl ti tam rozměr toho divu kterej se má centrovat. Bez toho to nejde.
Jo a v hlavní.html si smaž zbytečné tagy <li></li> </ul>Některé jsou tam zbytečně.

sorry já to neopravil má tam bejt ještě ten rozměr:
div#centrovak {width: 760px; margin: auto; text-align:left; position:relative}
tak.

Mira- dík už to funguje, nikdo tady nenapsal, že tam musí být zadaná i šířka.

Ale i tak všem děkuju!

sekec > Tak to je skoro jasný ne ;) ... když to chceš mít nák široký ;)

← Zpět na všechna témata

Nové příspěvky

Smazani stranek index.html ) HTML Tabulky Zalamování textu pomocí CSS Přesměrování Arduino - 400 Bad Request Nastavení českých písmen POMOC! po druhé! Pozicování (obrázek na střed). Jak vycentrovat obrazek, ktery je v prikazu absolute ? Použití tvůrce webu katalog async functions' is only available in es8 (use 'esversion: 8') Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 Problém s načítáním Div pro reklamu překrývá prvky webové stránky Nezobrazuje se mi lišta s reklamou ako nahrám na môj web favicon? JavaScript - nečitelný soubor *.js - jak prohlížet/editovat Problém s textem videostream index.html GB///refresh///JS Total Commander - server nenalezen Mobilní verze webu

Další témata

Webzdarma zvládnete to sami

Vystředění layotu pomocí divů

Nové příspěvky