| Autor | Zpráva | ||
|---|---|---|---|
| Dominik Skála Profil |
#1 · Zasláno: 8. 6. 2015, 20:58:12
Dá se nějak nastavit umístění atributu section v daném atributu div?
Díky moc za odpověď. |
||
| Tomáš123 Profil |
#2 · Zasláno: 8. 6. 2015, 21:12:55
Dominik Skála:
<section> ani <div> nie sú atribúty, ale prvky, elementy (v istom kontexte aj tagy).
Nie je mi jasné, čo máš na mysli... Meniť pozíciu prvku môžeš pomocou vlastnosti position. Daj si ale pozor na hromadné používanie vlastnosti position: relative. Na tvorbu layoutu s nerovnakým obsahom je totiž samostatne nepoužiteľná.
|
||
| Dominik Skála Profil |
#3 · Zasláno: 8. 6. 2015, 21:18:21
Aha, to se omlouvam, že jsem to napsal špatně.
Potřeboval bych section posunout asi o 40px nahoru, takže na to jak? |
||
| Bubák Profil |
#4 · Zasláno: 8. 6. 2015, 21:48:44
Dominik Skála:
„Potřeboval bych section posunout asi o 40px nahoru, takže na to jak?“ Bylo by dobré odkázat na živou ukázku, z ní se totiž dá poznat příčina, proč je section tak nízko, že ho potřebuješ dostat o 40px nahoru. Pravděpodobně to bude výchozí margin nějakého nadpisu.
http://jecas.cz/css-reset Jedna z možností (ale až ta skoro poslední, poslední je zmíněné pozicování) je dát elementu section záporný horní margin.
|
||
| Dominik Skála Profil |
AKTUALIZACE (23:24): Vkládám sem odkaz na obrázek, jak vypadá stránka a zdrojové kódy, tak snad se v tom vyznáte. Potřebuji dostat spodní sekci do mezery, která je tam vytvořena.
HTML: <body>
<div id="header" class="mobile-collapse">
<form>
<input type="text" class="type" autocomplete="on" placeholder="Vyhledávač" list="naseptavac">
<input type="image" img src="lupa.jpg" class="submit">
<datalist id="naseptavac">
<option value="Dominik Skála">
</datalist>
</form>
</div>
<div id="content">
<section id="atom" class="mobile-collapse">
<img id="facepic" src="atom.jpg">
</section>
<section id="atom" class="mobile-collapse">
<img id="facepic" src="zemekoule.jpg">
</section>
<section id="atom" class="mobile-collapse">
<img id="facepic" src="atom.jpg">
</section>
<section id="rightbox" class="mobile-collapse">
<img id="facepic" src="ffff.jpg">
</section>
<section id="spodek" class="mobile-collapse">
<img id="facepic" src="zemekoule.jpg">
</section>
<section id="downbox" class="mobile-collapse">
<img id="facepic" src="fffff.jpg">
</section>
</div>
</body>css: body {margin:0; padding:0}
#header {margin:0; padding:0}
#content {background-color:#999; width:100%; height:100%; margin:0; padding:0}
#atom{float:left; width:auto; margin-left:1%; margin-top:1%}
#spodek{float:left; width:auto; margin-left:1%; margin-top:-22%; position:static}
#rightbox{float:left; margin-left:1%; margin-top:1%; margin-right:1%}
#downbox{float:inherit; margin-left:1%; margin-top:-3%; width:46%; position:static}
img {max-width: 100%; height:auto; margin:0 0 10px 0}
#search{ alignment-adjust:middle}
input.type{ height:44px; width:24%; margin-left:10%; background-color:#999; font-size:20px}
p { font-size:195%; height:auto; margin-left:1%}
.submit {margin-left:-1%; margin-bottom:-1.2%}Odkaz na obrázek: http://www.imghosting.cz/view-66Bez_n_zvu.png |
||
| petr 6 Profil |
Nejspíš se ta spodní sekce do té mezery nevejde. Živá ukázka by pomohla v hledání řešení.
A mimochodem unikátní id by měl být v celém dokumentu použit jenom jednou, ten tvůj atom má být class, nikoli id. |
||
| Dominik Skála Profil |
petr 6:
AKTUALIZACE: Tak jsem nakonec vložil index do jiné své stránky, kterou spravuji, takže se můžete podívat na živou ukázku na stránce: http://ferraty.wz.cz Pokud nastavim posunutí posledni sekce do dané mezery, tak se mi tam vloží, ale smaže se mi pozadí, které mám nastavené v emelentu div (viz. odkaz). Kolem všech obrázku má být totiž ještě šedé pozadí, jak můžete vidět ve zdrojovém kódu. Poprosim tedy ještě o radu. |
||
| Tomáš123 Profil |
#8 · Zasláno: 9. 6. 2015, 16:38:20
Dominik Skála:
Použi clear a pôjde to.
|
||
| Dominik Skála Profil |
Tomáš123:
Myslíš do id ,,content"? Tam to totiž zkouším a nejde mi to. |
||
| Tomáš123 Profil |
#10 · Zasláno: 9. 6. 2015, 16:50:19
Dominik Skála:
„Myslíš do id ,,content"?“ Áno, v tvojom prípade musí byť clearovací prvok umiestnený až pred ukončovacou značkou <div>u s identifikátorom content.
|
||
| Dominik Skála Profil |
#11 · Zasláno: 9. 6. 2015, 16:54:19 · Upravil/a: Dominik Skála
Tomáš123:
Vložil jsem to se všemi možnými atributy a stále nic to neudělalo. Už se povedlo! Musel jsem tam vložit float:left a vyskočilo mi to zpět. |
||
| Tomáš123 Profil |
#12 · Zasláno: 9. 6. 2015, 17:37:24
Dominik Skála:
„Musel jsem tam vložit float:left a vyskočilo mi to zpět.“ Stačilo použiť blokový element. Ideálne neutrálny ako <div>. Možný by bol ktorýkoľvek ak by sme mu deklarovali display: block, čo sa konieckoncov deje i pri deklarovaní plávania.
|
||
|
Časová prodleva: 9 let
|
|||
0