CSS dropdown select option: styling WITHIN option text
Posted on 2015-01-06
i've found several CSS schemes that work for styling an HTML FORM dropdown menu
so that it uses a nice font and overall stylings.
However, for this project, the option text label content has three components (columns) that really could use some graphic delineation,
such as tab-like alignments ("columns") or at least Bold and/or Color changes in order to appear
somewhat organized and more readable.
For instance, here's a sample option label content:
6'x9' FREE SHIPPING - US$587.00
7'6"x9'6" FREE SHIPPING - US$778.00
8'x10' FREE SHIPPING - US$873.00
18'6"x24'8" SHIPPING CHARGES APPLY - US$1959.00
Even with several tries of CSS stylings found on the web, there seems no way to align, etc.
it's database-generated (which in itself is no problem), (and easy to apply divs/spans/classes)
but i'm looking for some technique to apply a tidy formatting scheme.
I suppose i could revert to some sort of a flyout radio button scheme that collapses once selected, and
then the text could be aligned with CSS classes. (but seems awfully awkward)