Tvorba Konkrétního flexibilního rozhraní

Kdybyste chtěli pomocí kaskádový stylů přenést toto "rozhraní" http://www.polyvore.com/cgi/app .. jak byste to udělali? (hlavně s ohledem na ohraničení, linky, které by se flexibilně zmenšovali a zvětšovali, dle okna prohlížeče)

Poradíte?

První reakce: ehm, cože?

Z mého pohledu je odkazované rozhraní postavené čistě na javascriptu. Nevím, co si představuješ pod pojmem pod přenesením pomocí kaskádových stylů, bez javascriptu (případně flashe nebo silverlightu) to prostě nepůjde.

Já nemyslel ani tak funkcionalitu, jako spíš samotný vzhled ..

V tom případě ti asi nemůžu pomoct. Nevím, co bys si chtěl z toho vzhledu vzít -- vždyť jsou to dva obyčejné rámečky (s nastaveným border), jedno (ne zrovna pěkné) menu řešené přes -moz-border-radius (takže ve většině prohlížečů se nezobrazuje zakulaceně) a seznam obrázků v divech s pevnou velikostí (floatovaných doleva pro dojem tabulky).

Upřímně řečeno, takové rozhraní bych si nebral za vzor ;).

Hm, to je možný, ale i tak by mě zajímalo, jak ty dva rámečky udělat, aby se automaticky roztáhlovali a zatahovali po celou stránku prohlížeče ..

Na to stačí krátký pohled do CSS daného webu, abys tam našel "width: 100%;"

No dobře, ale když je tam width 100%, tak by se ten rámeček měl roztáhnout po celou délku né? .. uh, jsem trošku noob no ..

A co takhle 2 rámečky s width:50%? ;)
Případně další část šířky použiješ na mezery/odsazení. Alternativně lze použít tabulku (i když to není tzv. moderní postup, v některých situacích z něj lze těžit :).

Ok, ale jak vyřešit flexibilní výšku takového rámečku? U výšky procenta, či "auto" nefunguje né?

Funguje, jenom musí systém vědět, k čemu se ta procenta vztahují. Tedy k nějakému vnějšímu boxu. Pokud žádný není, je jím zpravidla výška obrazovky. Nenapadá mě však, ve kterých případech by to mohlo být použitelné.

Pokud budeš někdy dávat velikost v px, pt, em nebo jiných konkrétních hodnotách, místo "width" dávej raději "min-width". Zabráníš tím tak běžnému nežádoucímu účinku, jakým je vytékání textů z boxů. Box se prostě roztáhne tak, aby se tam ten text vešel celý.

← Zpět na všechna témata

Nové příspěvky

Smazani stranek index.html ) HTML Tabulky Zalamování textu pomocí CSS Přesměrování Arduino - 400 Bad Request Nastavení českých písmen POMOC! po druhé! Pozicování (obrázek na střed). Jak vycentrovat obrazek, ktery je v prikazu absolute ? Použití tvůrce webu katalog async functions' is only available in es8 (use 'esversion: 8') Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 Problém s načítáním Div pro reklamu překrývá prvky webové stránky Nezobrazuje se mi lišta s reklamou ako nahrám na môj web favicon? JavaScript - nečitelný soubor *.js - jak prohlížet/editovat Problém s textem videostream index.html GB///refresh///JS Total Commander - server nenalezen Mobilní verze webu

Další témata

Webzdarma zvládnete to sami

Tvorba Konkrétního flexibilního rozhraní

Nové příspěvky