Autor Zpráva
Tomáš123
Profil
Zdravím, mám problém, kde nastavenie margin-top spôsobuje, že prehliadač posunie dolu celý obsah a nie len časť kde bol margin nastavený.
Trejpa
Profil
Tomáš123:
Ano, to je normální fungování vlastnosti margin, předává se nadřazenému bloku. Tomu lze zamezit, pokud má nadřazený blok nastaven nenulový horní padding nebo border, případně pozicování a plavání vnitřního bloku. Obdobně se předává i spodní margin.
Tomáš123
Profil
Trejpa:

Pridám kód aby si ma lepšie pochopil:
HTML:
<!DOCTYPE html>
<html lang="sk">
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/default.css">
        <title></title>
    </head>
    <body>
        <div id="wrapper">
            <div class="nav">
            </div>
            <div id="content">
                <div id="header">
                </div>
                <div id="main">
                </div>
                <div id="footer">
                </div>
            </div>
        </div>
    </body>
</html>

CSS:
html, body {
    height: 100%;
    margin: 0;
}
body {
    font-family: "Times New Roman", Georgia, Serif;
    color: black;
    font-size: .9em;
}    
#wrapper {
    min-height: 100%;
    
    background-color: #C1C1C1;
}
.nav {
    position: fixed;
    height: 40px;
    width: 100%;
    margin: 0 auto;
    background-color: #000;
}
#content {
    min-width: 400px;
    max-width: 800px;
    margin: 0 auto;
}
#header {
    margin-top: 40px;
}
#main {
    height: 1900px;
}

Ide o to, že hore mám fixné menu a potrebujem dostať obsah stránky mimo neho t.j. o 40px (čo je výška menu) nižšie, fixne alebo absolútne pozciovanie vyberie element z toku dokumentu.

Ďakujem za reakciu a pomoc.
Trejpa
Profil
Tomáš123:
Stačí ukotvit pozici.

.nav {
    position: fixed;
    left: 0;
    top: 0;
    height: 40px;
    width: 100%;
    margin: 0 auto;
    background-color: #000;
}
Tomáš123
Profil
Trejpa:
Ďakujem. Dával som to tam, ale potom mi to prišlo zbytočné, povedal som si, že je to predvolená pozícia a nie je nutné ju uvádzať. A už viem načo je dobré uviesť ju. Ešte raz dik.
Str4wberry
Profil
(Jenom doplním pár ukázek k „vytečení“ marginu, které zmiňuje Trejpa.)
Tomáš123
Profil
Str4wberry:
Ďakujem, inak práve čítam na jecas.cz o CSS, je to kvalitný zdroj a obsahuje mnoho cenných rád, ktoré sú podané jednoducho a každý ich pochopí.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: