Autor Zpráva
Tolike
Profil
Dobrý den, už od třetí hodiny ráno se snažím umístit divy vedle sebe tak aby byly dva vlevo napevno a dva vpravo procentualní

tedy - a) 200px b) 250px c) 80% d) 20% přičemž by by platily skupinky po dvou - x) 450px y) 100% -> { x=(a+b) } + { y=(c+d) }

https://dl.dropboxusercontent.com/u/70273677/responsable.jpg

opravdu nevím jak dál, objekty se mi buď překrývají nebo se vůbec nezobrazujou, někdy zase je to 100% stránky a ne 100%-450px.
Plaváček
Profil
Tolike:

Dva plovoucí vlevo o šířce 200 a 250px. Jeden plovoucí vpravo o šířce 20%. No a mezi nimi jeden neplovoucí, kterému nastavíš levý margin 450px a pravý margin 20%. Koukám na to rychle a brzo ráno, ale myslel bych, že to bude fungovat.
Tolike
Profil
potřeboval bych zprava 20% zbytku pod odečtení dvou panelu vlevo, tudíž (80%+20%)-450px
Plaváček
Profil
Tolike:

A co si představuješ pod pojmem 20 %? Nechceš můj návrh alespoň vyzkoušet?
DJ Miky
Profil
Pokud to chápu dobře, tak by stačilo c) a d) obalit do společného divu s margin-left: 450px a pak v rámci něj rozdělit poměrem 80:20 %. Nějak takto si to představuješ?

<style>
div {height: 400px;}
#a {width: 200px; float: left; background: #444;}
#b {width: 250px; float: left; background: #777;}
#cd {margin-left: 450px;}
#c {width: 80%; float: left; background: #AAA;}
#d {width: 20%; float: left; background: #DDD;}
</style>

<div id="a"></div>
<div id="b"></div>
<div id="cd">
    <div id="c"></div>
    <div id="d"></div>
</div>
Tolike
Profil
šíleně moc děkuju DJ Miky, zkoušel jsem to dál a našel jsem konečné řešení, myslíte že je to v pořádku?

<style >
aside {
    display: block;
    float: left;
    width: 450px;
    height: 100%;
}

nav#a {
    display: block;
    float: left;
    width: 200px;
    height: 100%;
    background: #474747;
}

nav#b {
    display: block;
    float: right;
    width: 250px;
    height: 100%;
    background: #e8e8e8;
}

#cd {
    display: block;
    margin-left: 450px;
    height: 100%;
}

#c {
    display: block;
    float: left;
    height: 100%;
    width: 80%;
    background: #ffffff;
}

    
#d {
    display: block;
    float: right;
    width: 20%;
    height: 100%;
    background: #e8e8e8;
}


</style>


<aside>
    <nav id="a"></nav>
    <nav id="b"></nav>
</aside>        
<div id="cd">
    <div id="c"></div>
    <div id="d"></div>
</div>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0