Diskuze – Řešené úlohy k úvodu do CSS preprocesoru SASS
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,
zkoušel jsem cvičení jedna a selhal jsem hned na začátku s umístěním
rámečku na střed stránky, když jsem si stáhl kód, tak vidím, že je to
řešení pouze odsazením od shora. Je vůbec možné bez použití javascriptu
umístit <div class="profil"> vertikálně na střed stránky? Zkoušel
jsem i metody použité zde: http://stackoverflow.com/…lly/18618259#…
ale nic mi nefunguje. Rád bych, kdyby mi to mohl ukázat někdo na
příkladu "cvičení 1". Díky 
Honza Bittner:18.1.2015 10:19
Mohlo by to jít, když si nastavíš 100% výšku body (a html):
body,
html {
box-sizing: border-box;
width: 100%;
height: 100%;
}A pak jen na ten element ostyluješ jako inline-block a nastavíš vertikální centrování.
.element {
display: inline-block;
vertical-align: middle;
}Nesmíš však zapomenout přidat aj pomocný div, který bude mít následující styly.
.pomocny{
display: inline-block;
height: 100%;
vertical-align: middle;
}Případně ponastavuj box-sizing na border-box, kdyby ti to dělalo
neplechu... 
jan.klapuch:18.1.2015 10:49
Dík za rady, ale bohužel mám element vlevo nahoře. Pomocný div má
obalovat element? Když jej dám dovnitř nebo ven, výsledek je stejný a
zarovnání se nekoná 
<body>
<div class="pomocny">
<div class="element">
<p>I'm 18 years old</p>
</div>
</div>
</body>body,
html {
box-sizing: border-box;
width: 100%;
height: 100%;
}
div {
.pomocny {
display: inline-block;
height: 100%;
vertical-align: middle;
}
.element {
display: inline-block;
vertical-align: middle;
border: 2px solid #000000;
}
}jan.klapuch:18.1.2015 14:49
Ten div element jsem tam původně neměl, pak jsem ho přidal kvůli tomu, že se mi neukazovalo ani ohraničení elementu. Když u mého fiddle odstraníš ten element, tak to nepomůže. Díky tvé verzi jsem ale mohl najít skutečný problém: Ve SCSS file sem udělal toto:
div {
.pomocny {
...
}
.element {
...
}
}compilace vytvořila
div .pomocnyDůležitá je tam ta mezera, která způsobí, že to nefunguje. Díky moc
Zobrazeno 10 zpráv z 19.