Stylování formulářového prvku <select>

Co jsem zatím viděl tak se tyhle custom nabídky dělaly dycky nastylovaným divem se seznamem resp. se samotným selectem to nemělo už nic společnýho jenom to tak vypadalo.

Stylování formulářových prvků se silně nedoporučuje, pokud na tom stylování trváš, tak zkus tohle:http://old.easy-designs.net/articles/replaceSelect/A článek, proč nestylovat :)http://latrine.dgx.cz/jeste-dokonalejsi-stylovani-formularu

Díky. Moc dobře vím, že formuláře by se stylovat neměly. A to nejen z praktických důvodů, které uvádí dgx, ale prostě proto, že nemám rád, když mi někdo/něco hrabe do GUI. Proto taky s tím selectem nechci dělat takové opičárny, jako v odkazovaném článku. Stačí mi pouhá změna barvy pro zlepšení přehlednosti. Nebo si myslíte, že obě verze jsou stejně přehledné? Možná je to, čeho chci dosáhnout, zbytečné... →

S tím jsem si kdysi hrál http://xy.wz.cz/example9/select.html

Koukám, že není na první pohled srozumitelné co to dělá, sám si to nepamatuji :-( Takže popis: 1/ select musí mít label 2/je to postavený na id=cx 3/vytvoří to div v něm p a ul a pro každý optiom li a odkaz s kotvou #, který má v rel hodnotu toho option, tuhle hodnotu posílá do vygenerovaného inputu s id=cil. Takže je třeba odchytávat hodnotu toho inputu v případě zaplého js, jinak se zobrazí normální select.

Napsal tracy;28783

Proto taky s tím selectem nechci dělat takové opičárny, jako v odkazovaném článku. Stačí mi pouhá změna barvy pro zlepšení přehlednosti.

To co požaduješ (pouhá změna barvy) neuděláš jinak, než simulací selectu jiným způsobem "div-em". Je už jedno, co s tim budeš chtít dělat graficky. :)

Děkuji všem za reakce.Já jsem se původně vydal cestou znásilnění optgroup.Toto je výsledek - je ale funkční pouze ve Firefoxu (nejspíš kvůli XUL). Dávám to sem jen pro zajímavost.

Když jsem sem psal příspěvky nahoře, nezobrazovaly se mi obrázky, kvůli výpadku. Teď vidím, že jsem byl mírně řečeno OT. Z těch dvou obrázků je rozhodně přehlednější ta verze vpravo, to ale bez nějaké náhrady selectu udělat nejde. Ono by to bylo poměrně složité i tím javascriptem. Asi bych to řešil tak, že bych za select dal prázdný span celé bych to obalil divem, informace o rozměru bych vložil do title u option a ten title bych posílal pomocí js do toho spanu při výběru položky. Takhle nějak <select onchange="document.getElementById('IdSpanu').innerHTML=options.title">