Autor Zpráva
Chates
Profil
Rád bych vás poprosil o názor na následující návod. Jedná se o univerzální CSS pro rychlou tvorbu formulářů. Doufám, že se to bude někomu hodit. http://www.pcblog.cz/clanek/311/jak-nejlepe-a-rychle-vytvorit-html-for mular-framework/
Plaváček
Profil
Chates

Neměl jsem čas to studovat celé, ale do FIELDSET nepatří H4, nýbrž sémantičtější element LEGEND. Nastavovat velikost písma v pixelech také není dvakrát moudré. Navíc si myslím, že float u prvku LABEL můžeš clearem řešit přímo a nepotřebuješ obezličku v podobě nadbytečného DIVu. Jinak řečeno - zbytečně složitý kód pro tak jednoduchý formulář.
ninja
Profil
U takovych to clanku je dulezity velky odkaz "ukazka" hned nahore.
Chates
Profil
2Plaváček: Element legend se mi nepodařilo nastylovat do takové podoby jako h4. Oprav mě, jestli se pletu, ale mám pocit, že to ani nejde. Validátor nehlásí nic o h4 ve fieldsetu. Co se týče nadbytečného divu, tak ve článku se zmiňuji o tom, že tento nadbytečný div je tam proto, aby mohl být formulář vícesloupcový, tj. více inputů vedle sebe. Tímto divem se vlastně říká, kdy už začít nový řádek formuláře a kdy ještě pokračovat. Div tam musí být.
vertigo4
Profil
Chates
Legend lze nastylovat jako h4, stejně tak, jako každý jiný prvek...
Plaváček
Profil
Chates

Element legend se mi nepodařilo nastylovat do takové podoby jako h4

To je tvůj problém.

Co se týče nadbytečného divu, tak ve článku se zmiňuji o tom, že tento nadbytečný div je tam proto, aby mohl být formulář vícesloupcový, tj. více inputů vedle sebe.

V tvém případě to ale tak není. Navíc, pokud už nutně musíš použít vícesloupcový formulář (což nebývá dobrý nápad), je lepší použít tabulku. DIV tam prostě být nemusí.
AlešD
Profil
Chates
Dříve jsem také formátoval formuláře pomocí div. Potom jsem pochopil (nebo si vsugeroval?), že label a pole formuláře jsou uspořádané dvojice, tj. šup s nima do tabulky a i bez CSS, v prostém HTML to vypadá dobře. Fieldset, legend, tfoot a thead, vše lze použít.

P.S.: Plaváčkovo řešení pomocí definičních seznamů je také dobré, ale jak jsem již naznačil tabulka je tabulka ( v tomto přísně vymezeném případě)

A teď mě kamenujte!

EDIT: Plaváček byl rychlejší :-)
Chates
Profil
2Plaváček: S elementem legend máš pravdu, je to můj problém, chovalo se to zvláštně, ale to teď nechme stranou. K tomu divu. Pokud formulář není vícesloupcový, tak tam žádný div být nemusí. Pokud ale chci, aby některé inputy byly vedle sebe a jiné ne (příklad, pokud jsi neviděl), tak POKUD nechci použít TABULKU, tak to musím přece nějak oddělit.

Pokud jsi opravdu Plaváček, tak o problematice víš mnohem víc než já. Rád se nechám poučit.
Plaváček
Profil
Chates

Pokud jsi opravdu Plaváček, tak o problematice víš mnohem víc než já. Rád se nechám poučit.

No, jsem to já, přiznávám se otevřeně :) O problematice formulářů jako takových jsem kdysi hovořil na nějaké konferenci a z výsledků jsem spáchal malý decentní webík, který se ale věnoval spíš přístupnosti a použitelnosti než formátování. Nechci tě v žádném případě poučovat, jenom mám pocit, že jsi prostě někde na zahraničním webu viděl bezva framework pro formuláře a šel jsi do toho. Ne vše, co přijde odjinud, bývá dobré řešení. Já být tebou, pojal bych to jinak.

Tabulka použitá ve formuláři ničemu neublíží ,a to ani z hlediska přístupnosti, když zachováš jeho lineární strukturu. Proč se za každou cenu mořit s nějakými DIVy, floaty a cleary, když nemusíš? Každý formulář má navíc jediný účel - donutit k akci uživatele. Takže - čím jednodušší a přehlednější ho uděláš, tím lépe pro tebe nebo pro majitele webu. V tebou odkazovaném příkladě nevidím jediný důvod, proč by formulář měl být ve dvou sloupcích.

Navíc, pokud svůj kód skoukneš třeba ve Firefoxu a zkusíš si zvětšit písmo, stane se ti lehce nepřehledným.

P.S. je dobrým zvykem v SELECTu třídit nabídku buď podle témat (pokud je obsáhlejší) nebo podle abecedy, aby se člověk rychleji chytil.
joe
Profil
Radši používám tabulku a to proto, že si nechci hrát s divy pro formulář, protože to je opravdu zbytečný.

Plaváček
Tabulka použitá ve formuláři ničemu neublíží ,a to ani z hlediska přístupnosti, když zachováš jeho lineární strukturu. Proč se za každou cenu mořit s nějakými DIVy, floaty a cleary, když nemusíš? Každý formulář má navíc ediný účel - donutit k akci uživatele.
Tak proč se patlat s divy na stránce a neudělat ho rovnou celý tabulkou, alespoň to z toho tvého popisu vyplývá (všiml jsem si, že jsi napsal ... ve formuláři...).
Plaváček
Profil
joe

Tak proč se patlat s divy na stránce a neudělat ho rovnou celý tabulkou,

Když budeš myslet lineárně (třeba jako hlasová čtečka), tak proč ne. Tak jo, nechtěl jsem si dělat reklamu, ale budiž http://www.plavacek.net/formulare/formular-a-tabulka.html
Str4wberry
Profil
Tomu nulování marginu u všech <input>ů bych se raději vyvaroval.
Chates
Profil
2Plaváček: Moc děkuju za kritiku, vážím si toho. Jen bych to uvedl na pravou míru, nejedná se o žádný zahraniční framework, ale čistě o můj nápad.

Také si myslím, že je lepší mít formuláře jen jednosloupcové, nicméně si dokážu představit situace, kdy to ušetří spoustu místa, pokud se bude jednat o dlouhý formulář nebo o nepovinné položky. Jen jsem se pokusil o zajímavý způsob, jak celkem snadno a rychle splácat složitější formulář. Ono když už je to hotové, tak bych řekl, že při druhém použití je s tím méně psaní než s tabulkou. Nemyslím si, že by můj kód byla nějaká velká prasárna až na tu h4. Uznávám, že jsem se zbytečně pracně snažil vyhnout tabulce. Ale je to také řešení.

Máš pravdu, že jsem na přístupnost tolik nehleděl a při zvětšení písma se to celé rozsype.
mantisa - nepřihlášen
Profil *
Chates
Toto není dobrý zvyk, prohlížeč je pak zbytečně zahlcen. Selektor * se aplikuje úplně na všechny elementy a často úplně zbytečně.

Jak zahlcen?
joe
Profil
Plaváček
Tak když se v tabulce udělají tři řádky, kde v prvním bude logo, nadpis webu, v druhém bude obsah a v posledním patička, přesto by se tu našlo plno lidí, kteřá by napsali, že tabulku ne. Dneska si myslim, že už je to jedno, protože prohlížeče se předhánějí v rychlosti vykreslování... Ale to sem nepatří :-X

Chates
Radši to proveď tabulkou, je to rychlejší a efektivnější v mnoha případech a bezproblémové.

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: