Diskuze – Lekce 19 - Fixní menu a pozicování v CSS
ZpětUpozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.
Ahoj, borci a borkyně, mám otázku nad kterou dumám už pár dní a nejsem
schopnej si odpovědět. Po vložení id=centrovac do kodu mi jakoby přestane
fungovat float u article header a section, zkrátka se mu nadpis článku
zobrazuje nad článkem samotným. Prosím dokáže mě někdo navést proč
tomu tak je ?
HTML:
<!DOCTYPE html>
<html lang="cs-cz">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="styl.css" type="text/css" />
<title>Stránka</title>
</head>
<body>
<header>
<div id="logo"><h1>Nášweb</h1></div>
<nav>
<ul>
<li><a href="rozlozeni.html">Domů</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
</nav>
</header>
<article>
<div id="centrovac">
<header>
<h1>O nás</h1>
</header>
<section>
<p>Úvod co bude na těchto stránkách</p>
<p>Proč jsme si stránky vlastně založili hmm</p>
<p>Nvm další bláboly, ELi co tu chceš?!</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
<p>Textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</p>
</section>
</div>
<div class="cistka"></div>
</article>
<footer>
<p>Tohle sem si napsal sám</p>
</footer>
</body>
</html>CSS:
article{
background: #6495ED;
padding: 30px 30px;
}
.centr{
text-align: center;
}
body article h1, h2, h3{
text-align: center;
color: #800080;
font-size: 2.5em;
text-shadow: 2px 2px 1px #000000;
color: white;
}
body{
background: url('pics/cerna.png') #000000;
font-size: 1.3em;
margin: 50px 0px 0px 0px;
min-width: 960px;
}
article header{
margin: 0px;
float: left;
}
article section{
float: right;
background: white;
border-radius: 10px;
box-shadow: 2px 2px 7px #1c2228;
padding: 20px;
}
.cistka{
clear: both;
}
.cistkal{
clear: right;
}
body > header{
position: fixed;
top: 0px;
}
#logo{
background: url('pics/pisk.png') no-repeat;
background-size: 100%;
float: left;
width: 50px;
height: 64px;
margin: 0px 0px 0px 10px;
}
#logo h1{
margin: 0px 0px 0px 55px;
color: white;
float: left;
}
nav{
float: left;
}
nav ul{
list-style-type: none;
max-width: 500px;
margin: 0px 0px 0px 100px;
}
nav ul li{
float: left;
padding: 20px 25px 27px 25px;
margin: 0px 20px;
line-height: 160%;
}
nav ul li a {
color: white;
text-decoration: none;
}
nav ul li:hover, .aktivni{
background: #DAA520;
}
footer{
color: white;
font-size: 0.5em;
}
#centrovac{
margin: 0px auto;
width: 960px;
}Vim že tady s tim budu zbytečně někoho otravovat, ale budu moc vděčnej
za radu.
Omluvte prosím jestli jsem něco napsal nesrozumitelně nebo špatně přidal
kod či cokoliv.
To pozicování je celkem záhada. Jako fixní menu budiž (to jde využít
na stránkách docela hezky), ale vůbec mě nenapadá, proč by se na stránce
mělo používat např. relativní pozicování. Chápu, že je to
doložení do výkladu lekce, ale použití za mě nulové.
Jinak děkuji za přehlednou lekci, pokračujeme dále 
Ahoj, potřebuji pomoct programuju si podle návodu a nefunguje mi to, tak jsem si web stáhnul a otevřel jsem si ho v opeře a ukázalo se mi toto nevíte proč ?
Zobrazeno 10 zpráv z 181.
