Autor Zpráva
Mihhc
Profil
Zdravím,

mohl by mě někdo prosím nakopnout jak udělat normálně (float-ama) následující lay-out (tedy spíš zda-li vůbec):

Já bych rád:
Aby byli v podstatě 2 sloupce.
Ale 1. aby se zúžil. A mělo to vliv na ten druhý.
Náčrt ještě zkusím:

__ MENU __ | ____ TXT ____
__ MENU __ | ____ TXT ____
__ MENU __ | ____ TXT ____
_ KEC _ | _____ TXT ______
_ KEC _ | _____ TXT ______
_ KEC _ | _____ TXT ______
_ KEC _ | _____ TXT ______

Nic jsem nenašel, ale ani mě nenapadá co napsat do vyhledavače, jestli to vůbec lze.

Díky za odpovědi, M.
panther
Profil
Mihhc:
mělo by fungovat něco podobného

<style>
#left1 {float: left; background: red; width: 300px;}
#left2 {float: left; background: green; width: 200px; clear: left;}
#right {background: blue;}
</style>
<div id="left1">left1<br>left1<br>left1<br></div>
<div id="left2">left2<br>left2<br>left2<br></div>
<div id="right">right<br>right<br>right<br>right<br>right<br>right<br></div>
Mihhc
Profil
panther:
Díky za reakci, ne tak úplně.

V podstatě ano, ale:

Rád bych aby se dotáhlo klasicky na konec stránky, k patičce.
MENU: By se natáhlo jen na odkazy, fcni.
KEC - zkrátka to pod tím: by se natáhl k patičce, dle délky obsahu(TXT).

Zkrátka něco jako Klasické schéma tránky, ale aby pod odkazy se sloupec zúžil.

HLAVIKA
------------------------------------
__ MENU __ | ____ TXT ____
__ MENU __ | ____ TXT ____
__ MENU __ | ____ TXT ____
_ KEC _ | _____ TXT ______
_ ___ _ | _____ TXT ______
_ ___ _ | _____ TXT ______
_ ___ _ | _____ TXT ______
------------------------------------
PATICKA
panther
Profil
Mihhc:
pokud chceš natáhnout pozadí podle nejdelšího ze sloupců (oba levé X pravý), bude se to řešit obrázkem na pozadí stejně jako na tebou odkázaném webu. Žádný další rozdíl už tam nebude, psal jsem jen schema.

Tím, že je spodní levý sloupec užší ani nevznikne žádný probém - pozadí nastavené u menu bude širší než pozadí oddělující sloupce a bude jej tedy překrývat.
Mihhc
Profil
panther:
Pokud Vám rozumím, tak navrhujete abych to udělal nějak takto:
#left1 {float: left; background: red; width: 300px;}
#left2 {float: left; width: 200px; clear: left;} /* pozadi z #right: mezi 200px zleva a textem*/
#right {padding-left: 200px; background: url(960px.jpg) repeat-y;}

Nešlo by to raději obráceně, že bych pozadí definoval u #left2, a to by se opakovalo až do patičky. Protože podle konstrukce výše se delší text v #right obalí kolem všech left.
panther
Profil
Mihhc:
že bych pozadí definoval u #left2
pozadí musíš přiřadit nadřazené položce všem třem blokům (a přidat jí overflow: hidden, aby ses za chvíli neptal, proč pozadí nevidíš :-) ).

Protože podle konstrukce výše se delší text v #right obalí kolem všech left.
#right {margin: 0 0 0 200px} /* sirka kratsiho sloupce */
Mihhc
Profil
panther:
Tomu rozumím.

Já už to asi chápu, prostě se ptám principiálně na blbost, protože se #left2 neroztháne sám o sobě. Ale jenom to tak vypadá kvůli okolí.

Navíc grafika koukám jde i přímo umístit.

Díky za reakce.
panther
Profil
Mihhc:
protože se #left2 neroztháne sám o sobě. Ale jenom to tak vypadá kvůli okolí.
ano, na tomto principu iluze fungují všechny layouty, které mají stejně dlouhé sloupce. Tedy, „stejně dlouhé sloupce“.

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: