Autor Zpráva
T-fon
Profil
Ahoj, poprosil bych o radu jak nastylovat zelený div, aby byl v jakoliv širokém okně vždy přilepený na spodní okraj žlutého divu, který bude stejně dlouhý jako modrý.
Použil jsem i jiné finty na stejnou výšku sloupců, např. JS, ale stále se nedaří.
Viz. Živá ukázka
T-fon
Profil
Tady je ukázka použití JS, pak to funguje s absolutní pozicí. Nemůžu to ale použít, protože ve skutečnosti budu mít místo zeleného divu obrázek a u něj pak nefunguje bootstrap třída img-responsive.
scheras
Profil
Třeba takhle?
T-fon
Profil
To ne... Ten zelenej div (obrázek) musí být v pravém sloupci.
Tomáš123
Profil
T-fon:
a u něj pak nefunguje bootstrap třída img-responsive
Ale funguje.
T-fon
Profil
OK, díky moc. Akorát teď koukám, že řešení s JS neni nejštastnější, protože na mobilu chci mít obrázek hned pod červeným divem, ale takhle tam bude vždy ta výška levého divu.
Ale to by se asi dalo vyřešit podmínkou. Pokud tedy není nějaké elegantnější řešení, než JS...
Tomáš123
Profil
T-fon:
Sloupce stejně vysoké

Pokud tedy není nějaké elegantnější řešení, než JS...
@media screen and (max-width: ...) {height: auto !important}.
T-fon
Profil
Já jsem ty metody stejně vysokých sloupců samozřejmě čet, v tom problém neni, mám problém to zkombinovat se zarovnáním.

Pokud to má být takto:
@media (max-width: 767px) {
    height: auto !important;
}

Tak se nic nezmění, pokud to přiřadím sloupci .right, překryje se obrázkem červený div.
Tomáš123
Profil
T-fon:
Pardón, keď som to napísal do riadku, nevšimol som si, že tam chýba selektor. Pomôže pridať toto:
@media screen and (max-width: 767px) {
    .right {
        height: auto !important;
    }
    .right-bottom {
        position: static;
    }
}

Čo sa týka JavaScriptového riešenia rovnako vysokých stĺpcov, hodnotu je potrebné dosadiť za min-height (a zmeniť to aj v @media deklarácii). S fixnou výškou, hoci dopočítanou, za rozpadá layout (výška obsahu sa zmení aj pri zmene veľkosti písma, či šírky zobrazovacej plochy).
T-fon
Profil
Super, teď to funguje perfektně, díky moc!
Tomáš123
Profil
T-fon:
Ešte to nefunguje. Buď sa rozpadá layout kvôli fixnej výške alebo nie sú stĺpce rovnako vysoké. Niečo som skúsil a už viem, prečo nepoužívam Bootstrap :-).

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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