Autor Zpráva
Vapenka_reditel
Profil *
Zde je příklad

Co potřebuji? Nic složitého, jen poradit, jak jednoduše udělat stránku, která je rozdělená na dva "divy", každý zabírající jednu polovinu a zároveň flexibilně měnící velikost při zmenšení okna prohlížeče. Následně do těchto dvou "Divu" vložit další podřízený div a tak, aby vždy flexibilně reagoval na zmenšení, či zvětšení daného okna prohlížeče a tak, aby obsahem nezasahoval do druhého z nadřazených divů ...

uf, nevím jak jinak to popsat .. snad mě někdo pochopí a pomůže mi :-(


Rad bych podotknul, že jsem to zkoušel hlavně pomoci text align center, left, atd a tak nějak to dát dohromady, ale jelikož to příliš nefungovalo, tak by mě zajímal nějaký elegantnější způsob ...
majja01
Profil
Vapenka_reditel:
takto? kdyžtak tady je zdroják ;)
Vapenka_reditel
Profil *
Super!

A teď ještě jeden problém ..... jak to těch jednotlivých "divů" vložit obsah, který by flexibilně reagoval na změnu šířky toho nadřazenýho divu ....

Pro příklad ..

v css mám tohle:

#blabla {position: absolute; width: 252px ;top: 20px; right: 30px; }

a v kodu stránky posléze tohle:
<div class="jeden">
<div id="blabla">ahoj, ahoj, ahoj</div>
</div>

Tak jak udělat, aby to prohlížeč chápal tak, že ten right 30px se má počítat od pravé strany toho classu "jeden" a zároveň, při zmenšení okna prohlížeče, se daný obsah automaticky posouval směrem doleva?


Pro lepší pochopení, ukázka ..... já vím, že se to nějak dělá přes ten class a positive a relative pozicování, ale furt to zkouším a nic ...... né a né pochopit, že obsah v první "divu" class "jeden" se má zastavit u jeho rohu, atd ... achjo.
Vapenka_reditel
Profil *
Uf, tak už jsem na to asi přišel ... ale nevím, jestli je to správné řešení ...

v css, kde mám:

.druhy {
  background:#222222;
    width:50%;
    height:100%;  
    float:left;
    
}

jsem hodil:

#ab {position: relative; top: 0px; left: 0px; }  
#cd{position: absolute; width: 200px;  top: 1px; right: 34px; text-align: right } 

a do html jsem to udělal takhle:

<div id="ab" class="jeden">
<div id="cd">
<img src="menu.png" >
</div></div> 

a nějak to asi funguje ..

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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