Autor Zpráva
kuzmic
Profil
Dobrý den,

chtěl bych poprosit o radu, jak vyřešit problém při návrhu eshopu šablony, konkrétně pak výpisu produktů, když velikost např. názvu produktu nebo popisku, přesáhne povolenou výšku html elementu např. H3.

Aby nedošlo k automatickému zvětšení výšky a tím rozbití celkového layoutu, mám na jednotlivých elementech aplikovanou vlastnost overflow: hidden. Což bohužel způsobí, že pokud je název, popisek delší nezobrazí se někdy podstatné informace.

Jednoduchá ukázka zde: http://jsfiddle.net/BdPGU/

Nevíte prosím jak tuto situaci řešit? Upravit délku názvu, popisku není úplně ideání :-/

Díky za jakékoli rady

Kuzmic
anonymníí
Profil *
kuzmic:
přesáhne povolenou výšku html elementu např. H3.
výška nadpisu není omezená, není co přesahovat. Udělej návrh tak, aby bylo dost místa.

Aby nedošlo k automatickému zvětšení výšky a tím rozbití celkového layoutu
jeden nadpis by neměl celý web rozbít. Máš to navržené blbě.

Nevím, nač se ptáš. Konkrétní návrh, aby se dalo napsat, jak to udělat lépe, jsi nepřiložil. Jinak je jasné, že čemukoliv omezíš výšku, může přetéct nebo se nevejít.

Zajímá mě, jak chceš řešit to, že u tebe bude vše krásně srovnané, ale někteří uživatelé nemají font, který pouříváš. Nebo používají jinou velikost písma. Všichni takoví u tebe nebudou moci nakupovat?
Chamurappi
Profil
Reaguji na kuzmice:
Nastavovat textovým blokům pevnou výšku je vždy chyba.

h3.product-name { height:42px; }
Nikdy nevíš, jak je doopravdy velké písmo.
kuzmic
Profil
Chamurappi:

Vidíte, to jsem si neuvědomil. Děkuji. Nicméně tento blok s nadpisem by měl mít nějakou fixní výšku např. na dva řádky., já právě řeším situaci, kdy může přijít nadpis, který má tři řádky. Jestli tedy na konec viditelné části doplňovat ... (tri tečky)?
anonymníí
Profil *
kuzmic:
jediné správné je zobrazit celý nadpis produktu. Nevím, jak by se ti líbilo, kdybys něco vyrobil, někdo jiný to prodával a prezentoval to pod jiným = neúplným názvem.
kuzmic
Profil
Máte 100% pravdu. To je přesně to co teď řeším, ale podle návrhu, je na nadpis, popisek určená fixní výška, aby celý produktový box měl vždy stejnou výšku a seděl do "mřížky".
Chamurappi
Profil
Reaguji na kuzmice:
Nicméně tento blok s nadpisem by měl mít nějakou fixní výšku např. na dva řádky.
Proč měl?

Jestli tedy na konec viditelné části doplňovat ... (tri tečky)?
Nadpis mi nepřipadá jako místo, ze kterého by se měla vypouštět slova kvůli malicherným důvodům.

any celý produktový box měl vždy stejnou výšku a seděl tedy do "mřížky"
Budeš se muset rozhodnout, jestli je mřížka důležitější, než vidět celý nadpis… dle mého názoru není.
kuzmic
Profil
Chamurappi
Pokud budou jednotlivé prvky dynamické a reagovat na obsah jednotlivých prvků (nadpis, popisek), vzniknou různě vysoké produktové boxy. Neměla by zde přeci být jen nějaká maximální hranice?
anonymníí
Profil *
kuzmic:
bavíme se o něčem, o čem se bez konkrétní znalosti konkrétní situace nemá cenu bavit.

Můžeš zkrátit popisek, ale nadpis vypiš celý. Nebo snad člověku, který má horší zrak, a proto větší písmo v systému, neukážeš z nadpisu nic než pár prvních písmenek jen kvůli tomu, aby se ti někde nerozhodila mřížka?

Ne každý má to štěstí, že je zdravý (což, předpokládám, jsi, alespoň v tomto směru)
Chamurappi
Profil
Reaguji na kuzmice:
Pokud budou jednotlivé prvky dynamické a reagovat na obsah jednotlivých prvků (nadpis, popisek), vzniknou různě vysoké produktové boxy.
Sníží tato různost příjmy víc, než useknuté nadpisy/popisky? „Brr, produktové boxy mají různě vysoké, tady si nic nekoupím…“ :-)
Estetické nedokonalosti nepochybně nějaký vliv na rozhodování zákazníka mají, ale nijak závratný, nepřeceňoval bych je. Ošklivá dobře použitelná stránka na tom bude pořád lépe než nádherná špatně použitelná.

Neměla by zde přeci být jen nějaká maximální hranice?
Zkus nějak zařídit, aby byly popisy podobně dlouhé. Myslím na počet slov/znaků, ne na pixely.
Str4wberry
Profil
Asi jediná možnost (kromě vykašlání se na výšku) je posouvání.
margin
Profil *
Z popisu problému nechápu, o co jde. Je podstatný počet řádků nadpisu, nebo mít stejně vysoké boxy? Stejně vysoké boxy, které ve skutečnosti stejně vysoké nejsou jdou udělat poměrně jednoduše.
http://klient.plavacek.net/stejne-vysoke-sloupce/
Str4wberry
Profil
Pokud jsem to pochopil správně, tak problém je toto.
margin
Profil *
Str4wberry:
tak problém je toto.
To je to, co nevím. kuzmic vidí řešení ve fixních výškách, protože nerozbíjí celkový layout. Ale pokud jsou v Plaváčkově ukázce vedle sebe nadpisy s různou výškou, tak výsledek sice tolik nelahodí oku, ale layout to nerozhodí.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0