Autor Zpráva
IdemeNaHavaj
Profil
Ahoj.

Mám taký problém s nastavením divu na 100 ako je to možné.
Mám 2 divy vedla seba, .sidebar (navigáciu) a .content (obsah).

Sidebar mám nastavený ako:
.sidebar {
    position:fixed;
    left:0px;
    top: auto;
    width: 14%;
    min-width:200px;
    min-height:100% !important;
    height:auto;
    background-color: #333;
}
to je v poriadku, menu mám vždy v ľavom stĺpci ako chcem. Problém začína keď chcem nastaviť .content na width toľko, koľko je to možné.
Ak dám 100%, nastaví sa na 100% okna (a pôjde aj za .sidebar). Ja potrebujem, aby ten .content "narazil" do sidebaru a už sa nezväčšoval.

| sidebar | content 100% | - správne

|| sidebar content 100% | - nesprávne

Ďakujem za pomoc.
Joker
Profil
IdemeNaHavaj:
Ak dám 100%, nastaví sa na 100% okna
Protože position:fixed vyjme prvek z toku dokumentu (stejně jako position:absolute), takže prvky s třídou sidebar nemají žádný vliv na výpočet rozměrů a umístění ostatních prvků.

Ale jestli těch 100% u prvku content je 100% okna, asi by mu stačilo nastavit levý padding, do kterého by se ten .sidebar vešel.
IdemeNaHavaj
Profil
Joker:
hej, padding zlava som mu dal 14%, ale min-padding: 200px neexistuje, tak tomu nerozumiem
anonymní
Profil *
IdemeNaHavaj:
ale min-padding: 200px neexistuje, tak tomu nerozumiem
co na tom nechápeš. Padding je vnitřní odsazení, není třeba, aby existovalo minimální vnitřní odsazení.

Já zase nechápu, proč máš ten element pozicovaný (a k tomu ještě fixně), když chceš, aby se choval jako nepozicovaný.
IdemeNaHavaj
Profil
anonymní:
proč máš ten element pozicovaný (a k tomu ještě fixně)
Pretože chcem aby sa scrolloval spolu s oknom? :)

A inak viem dobre čo je to padding..
anonymní
Profil *
IdemeNaHavaj:
A inak viem dobre čo je to padding..
skutečně? A proč tolik podivu nad neexistující (a zbytečnou) vlastností min-padding?
IdemeNaHavaj
Profil
anonymní:
Ano skutočne. To "min-padding" som si vymyslel ako príklad, čo neexistuje.. Prečo sa chceš hádať? Radšej mi poraď riešenie ako teda vyriešiť môj problém bez použitia <tabuliek>, a aby bol sidebar fixnutý s mininálnou width.
Joker
Profil
anonymní:
co na tom nechápeš. Padding je vnitřní odsazení, není třeba, aby existovalo minimální vnitřní odsazení.
Já jsem mu poradil pokrýt šířku toho prvku paddingem.

Jenže šířka prvku je 14%, ale minimálně 200px. To paddingem opravdu půjde pokrýt těžko. Jednoduché a elegantní řešení mě teď nenapadá, třeba s ním přijde někdo jiný.
Ale nevidím důvod se navážet do IdemeNaHavaj-e za upozornění, že paddingem to tak jednoduše nepůjde.
To spíš já si nevšiml toho min-width.
anonymní
Profil *
Joker:
tak jedno řešení by bylo dát pod fixní blok prázdný element s float: left; width: 14%; min-width: 200px;


případně i výškou fixního elementu, pokud ji známe. Pokud ne, půjde najít jiné řešení, ale bez odkazu na web těžko.
Trejpa
Profil
IdemeNaHavaj:
Vzhledem k tomu, že většina uživatelů stejně uvidí sidebar široký 200 px, bych se na nějaká procenta vybodl a nastavil to napevno.

Ta procenta se projeví od šířky okna 1429 px. Já třeba používám okno prohlížeče do šířky okolo 1300 px. Na Full HD monitoru bude při okně ve fullscreenu bez okrajů sidebar široký 235 px – stojí ti 35 px (rozšíření sidebaru o 15 %) za námahu?

Pokud ano, navrhuji použít tabulku nebo si procenta doskriptovat (závislost šířek sidebaru vůči zbytku).
IdemeNaHavaj
Profil
Trejpa:
v % to mám pretože aj .content mám rozťahovací v %. Ak mám 14% sidebar, tak content mám 84%.
Ak dám .sidebar width 200px, neviem zistiť koľko width má mať .content.


Už to mám vyriešené inak. Tak ako som chcel to nešlo.
Trejpa
Profil
IdemeNaHavaj:
Ak dám .sidebar width 200px, neviem zistiť koľko width má mať .content.
Jak to? Přece výchozí šířka (100 %) a k tomu levý padding 200 px, jak psal Joker. Bez plavání, jen sidebar bude mít fixní pozici.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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