zahnuté rohy divu IE

Jo, několik způsobů je tu často zmiňovaných, zkus se porozhlédnout v diskuzi. Já vím o tomhle odkazu http://www.fireandknowledge.org/archives/2004/05/22/rounded-corners-wi thout-images-part-1/ ale nevím jestli je to zrovna ideální.

Třeba backgroundem.
Kdyžtak mrkni třeba na http://habendorf.plavacek.net/apeli/

Já tam hlavně nevidím kulatý rohy...

PerToon, zis: No hoši nezlobte se, ale já jich tam vidím docela dost. Je fakt, že mají dost malý rádius, ale to na principu nic nemění.



A je jich tam víc :o)

No dobře, no, jeden pixel, tomu jěště něříkám zakulacený rohy, to mi mohl taky někdo plivnout na monitor ;-)

PerToon: No dobře, no, jeden pixel, tomu jěště něříkám zakulacený rohy, to mi mohl taky někdo plivnout na monitor ;-)

Skoro ani nevím co na to říct. Snad jen to, co už jsem psal výše - jde o princip a rádius si každý udělá jaký chce, ne?

habendorf - Jo, pak už se to dá upravit, já jen, že jsem opravdu nepostřehl při tom tvým radiusu (radiu?), že je to zakulacený... Tak se omlouvám že jsem pochyboval... už to neřešme, jde o to, že to jde.

Jak jsem psal už výše - dělal jsem to backgroundem.

kulate rohy - before / after
http://virtuelvis.com/gallery/css/rounded/
http://www.w3.org/Style/Examples/007/roundshadow.html
kulate rohy - ramecky a mnoha prvky
http://css.interval.cz/priklady/priklad-21-1.htm

pak to lze udelat formou tabulky,treba
[/][---][\]
[|][....][|]
[\][---][/]

habendorf
nejak mi tam k tomu nesedi to tmavy logo a ta spousta ramecku, jinak dobry, celkem

habendorf Jinak, kdybych mel dela kulate rohy, urcite pouziji javascript ala FRED a jeho append child :) . Nejak mi to prijde dost trapne davat tam vice divu do sebe, ale jako je to jedno z reseni.

peta:

nejak mi tam k tomu nesedi to tmavy logo a ta spousta ramecku, jinak dobry, celkem
Já to kódoval dle zadání, grafika není moje práce.

Jinak, kdybych mel dela kulate rohy, urcite pouziji javascript ala FRED a jeho append child :) . Nejak mi to prijde dost trapne davat tam vice divu do sebe, ale jako je to jedno z reseni.
To je věc názoru. Mě nepřijde trapné zanořit více divů, spíš mi přijde trapné aby to bez JS nefungovalo.

Mě nepřijde trapné zanořit více divů, spíš mi přijde trapné aby to bez JS nefungovalo Vše co jsem v posledních asi dvou letech vypustil funguje i bez js ;-) BTW možná slovo trapné není to pravé pojmenování spíš je to na nic. Nakonec to končí takhle http://diskuse.jakpsatweb.cz/index.php?action=vthread&topic=4672&forum =1&page=-1 a krom jiného když pak takový web projedeš přes http://www.holovaty.com/tools/getcontentsize/ tak přijdeš na to, že za cenu kulatých rohů na kdečem se obětovala značná část objemu přenášených dat ve prospěch grafiky vůči obsahu. Javascriptem uspoříš minimálně 70% takže mě Tvůj názor dost překvapuje. Poslední dobou cítím nějaký v Tvém úsudku nějaký vliv, který tam dřív nebyl?

Fred:

Uh, takže

1) Nereagoval jsem na tebe, ale na petu. Zřejme jde o to jeho javascript ala FRED a jeho append child - no ty jsi sem ani žádný takový příspěvek nedával, takže ani nevím co tím má peta na mysli. Asi něco na způsob nifty corners. To je řešení, které má bezesporu svůj půvab, na druhou stranu, můj názor je ten, že na pomalejších strojích při hodně zakulaceních může docela zavařit procesoru. Navíc nerad řeším věci až u klienta, jdou-li řešit už dříve.

2) Srovnání s http://diskuse.jakpsatweb.cz/index.php?action=vthread&topic=4672&forum =1&page=-1 je úplně bezpředmětné, podívej se prosím do kódu té mojí stránky.

3) Moji stránku jsem sem dal jako námět pro zise, jak je to také možné řešit. Ne proto, aby někdo hodnotil tmavost loga nebo to, jak jsem se rozhodl dělat kulaté rohy - nikdo nezná pozadí zakázky a důvody, proč jsem se to rozhodl v daném případě řešit takto.

4) Kód se v tomto případě zvětší o 2x
<div class="oddelovac">
&nbsp;
</div>
a je tam jeden obrázek, který má 94 (slovy devadesát čtyři) bajtů. Do toho se s JS v životě nevlezeš.
Zbylé rohy jsou dělané tak, že obrázek, který tam beztak musí být, má o 1px větší výšku než by měl jinak.

5) Javascriptem uspoříš minimálně 70% - v tomto případě ani omylem.

6) Pořád nevím, co je divného na zanoření dvou divů do sebe - považuji to za zcela běžné.

7) Poslední dobou cítím nějaký v Tvém úsudku nějaký vliv, který tam dřív nebyl?
To je možné, každý se vyvíjíme určitým směrem. Sám to nepozoruji, ale člověk sám sebe většinou nevidí tak dobře, jak ho vidí ostatní, to je fakt. Je ale pravda, že JS se snažím používat jen tam, kde je to nezbytně nutné. Nepovažuji ho za technologii pro tvorbu vzhledu stránky, k tomu se snažím maximálně využívat možností (x)html a css.

Závěrem bych chtěl znovu zdůraznit, že jsem reagoval na petu a rozhodně v tom nebylo nic osobního ani vůči tobě, ani vůči tvému JS řešení (které jsi tu ovšem neprezentoval).

habendorf Promiň, nekoukal jsem do toho kódu, asi bych se měl po třech nočních třeba vyspat, držím se na nohou u počítače, abych se přehodil do normálního režimu spánku a pak nepřiměřeně reaguji.

Fred: Omlouvat se rozhodně netřeba, jen jsem chtěl, aby se to vyjasnilo. Tak hajdy na kutě a dobrou :o)

> 1) ... co tím má peta na mysli. Asi něco na způsob nifty corners. To je řešení, které má bezesporu svůj půvab, na druhou stranu, můj názor je ten, že na pomalejších strojích při hodně zakulaceních může docela zavařit procesoru. Navíc nerad řeším věci až u klienta, jdou-li řešit už dříve.

Mně přijde JS ideální - zrychlí přenos, pokud ho někdo nemá, zas tak moc se nestane, a je elegantní. Procesoru to nezavaří, rozhodně ne tak, že by to někdo poznal – např. jakákoli AJAXová aplikace bude řádově náročnější než přidání těch pár prvků.

habendorf Uz barvy nerozebirej, nevedel jsem, ze slo o zadani. to neni, co resit.
Nevim, kdo ma jake pomale stroje, nerikam, ze je to spatne, jenom, ze bych pouzil FREDovi finty s append-child. Fredovi proto, ze je pouziva on dost casto pro ruzne sve vychytavky, bookmarks a pod. Prijde mi to velice elegantni.
Souhlasim, ze nekde to muze delat problemy a souhlasim, ze pri vypnutem nebo nespravnem js se nic nezobrazi. Ale proc by melo? Kulateni je spis pro okrasu.
94 byte obrazek, to je sice zajimave, ale jaksi zapominas na tech 8 divu, ci kolik pouzivas, plus CSS. CSS samo v js musis take napsat, to je neodmyslytelne, ale pro kazdy prvek 8 divu uz ne. dovolim si tvrdit, ze uz pri 3 zakulacenych blocich by to vyslo asi tak kodove stejne.
Jinak povazuji za zbytecne to rozebirat dal, protoze maji vsichni pravdu :) Hodne zalezi na tom, jak, kolik a proc to pouzije.

Jinak jsem zapomnel zmitit -moz-border-radius, coz se da celkem pouzit take. misto JS.

ale pro kazdy prvek 8 divu uz ne
Jenže tak to tam řešené není. Však se mrkni.

Jinak jsem zapomnel zmitit -moz-border-radius, coz se da celkem pouzit take
To je jasné, ale klient chce i IE :o)

BTW: na 94 byte obrazek je pořád obvykle potřeba přenést cca. 1kB http hlaviček, nehledě k tomu, že samotný requeust má taky nějakou režii, takže stáhnout 1 4kB soubor je obvykle rychlejší než stahovat 4 96b soubory.

habendorf
To priznavam, ze jsem to moc neprohlizel. Jen tak z lehka jsem tam zahlidl asi 7 vnorenych divu po sobe, tak jsem myslel, ze je to ono.
presneji tuto strukturu...

 <div class="main">

          <div class="left-and-middle">

            <div class="middle">

              <div class="middle-content">

                <h3>Nadpis kategorie / podkategorie</h3>

                <div class="zbozi">

                  <div class="zbozi-left">

                    <div class="zbozi-left-top">

Mozna ti to prijde jako hloupa otazka, ale jak je to tam delane? V CSS nemuzu nic najit, co by zpusobovalo rozky, na prvni pohled... Konkretne jsem hledal ten obrazek letmo...

Tak main je asi jasný.
Left-and-middle je kvůli tomu, aby mohl být střední sloupec v kódu jako první.
Middle je prostě střední sloupec, který je v rámci left-and-middle floatován doprava.
Middle-content je obyčejná matrjoška uvnitř middle.
No a dál už je to jen floatování uvnitř zboží.

Mozna ti to prijde jako hloupa otazka, ale jak je to tam delane? V CSS nemuzu nic najit, co by zpusobovalo rozky, na prvni pohled...
Tak se ještě trochu snaž :o)

Mně by to taky zajímalo... slyšel jsem že to CSS umí samo o sobě, bez kdejakých obrázků apod. ale zaboha jsem o tom nic nenašel. Je to pravda?

Onecar: Není to pravda. Pro Gecko existuje sice nestandardní vlastnost -moz-border-radius, ale obecně to css neumí.