I have a question. In my project I have something like filter, where people can select: Category, Country and Year, so I have to use “Option Select”. But I would like to correct the design of dropdown list- right now in Blocsapp the text inside of dropdown list is too small, with small paddings (top&bottom).
How can I correct it? Should I make class like " .select-option .dropdown li "? I tried almost everything, but with no success. If there is no option, it could be considered to “Wish list” (together with table brics too).
Not sure on this without a URL to a page, but if I understand what you’re using for the options. You could try opening up class manager, add a class named: .form-control
Then change the font in that class.
I tried to make class " .form-control " - I put text to be RED, so I could see the difference. But red text/changes appeared on selected option -on the SelectOption button, but not inside the dropdown-list as I wanted.
I will be appreciated if you or somebody else could give me some ideas to solve the problem Thanks in advance
OK, I thought you wanted to change the size. Try changing the font-size on .form-control class that works for me. The color appears to be set from a different point.
On your first dropdowns(beige), you are using a button drop down.
You have some custom CSS:
.dropdown-menu li a
This is working as the font is set to 15px (default is 14px).
Not sure what you want the button (with an anchor) or the drop-down (with an option), or color or font?
Add a custom class to the list (example I’m using custom-list).
Now add the following in special class in the class manager:
.custom-list>li>a
Now Edit the new custom class, change padding top and bottom to 0 (or what you want).
Change the font to what you want and line spacing.
It works perfectly for BUTTONS dropdown, but not for OptionSelect- these are different things. The same changes I want to make for list inside the OptionSelect - to make bigger font-size and increase line-height.
(As it’s shown on the image I posted before- by default the text inside the list of OptionSelect is black, small and almost with no line-height - this is what I want to change).
Really sorry for my English
Thank you for the effort to help me!
The option select is a native UI component rendered by the OS. It’s not possible to style them effectively across all browsers and OS’s. You may be able to change the font and the font style, but Im not aware of an effective way apply padding etc. If there is a way it will be hacking and most likely not work on all OS’s.