Drop Down List Styling

Hey D5WDesignGroup,

There’s no option to modify the styling however Quick Css or custom css can be used to modify it.
Can you give us a screenshot or mockup of how you want it to look and maybe we can try to give you css code that might help achieve what you wanted it to look like.

Best regards,
Nikko

Hi Dan,

It is using this css code:

#top .main_color .input-text, 
#top .main_color input[type='text'], 
#top .main_color input[type='input'], 
#top .main_color input[type='password'], 
#top .main_color input[type='email'], 
#top .main_color input[type='number'], 
#top .main_color input[type='url'], 
#top .main_color input[type='tel'], 
#top .main_color input[type='search'], 
#top .main_color textarea, 
#top .main_color select {
    background-image: url('image_url_here')!important;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.7)!important;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: rgba(255,255,255,0.5)!important;
    font-size: 10pt!important;
    color: #ffffff!important;
    border: none!important;
}

however you will need to change the background-image url from image_url_here to the right url (the board image).
Then finally you will need some chalkboard fonts: http://www.ucreative.com/resources/20-free-chalkboard-fonts/
Hope this helps.

Best regards,
Nikko

Hi Dan,

I apologize for misunderstanding, the dropdown list you are referring could not be modified in its current form.
You can check on the explanation here why the native option can’t be styled: https://stackoverflow.com/questions/7208786/how-to-style-the-option-of-a-html-select
However there are some jquery plugins that replaces this: https://www.learningjquery.com/2017/09/20-impressive-jquery-plugins-to-replace-the-html-select-box
We could not help with this modification as it is out of our scope but we’ll try to help you with it.
I would suggest using select2 since its popular: https://select2.org/getting-started/basic-usage

Best regards,
Nikko