Dropdown list CSS in Web Form Builder...

User 2482323 Photo


Registered User
4 posts

Hi,
I'm using the dark grey responsive theme and I'm disappointed I don't have more WYSIWYG control over the dropdown styling. I'm an intermediate CSS coder and I'm impressed with how much your software does to save me time, however there's a pretty big discrepancy between the text input boxes and the "select/dropdown" containers. The padding and color within the text input boxes allows for a generous (and easily alterable in CSS) container around the text. The dropdown elements do not have the same default attributes within the theme, making them look much smaller in height compared with their neighboring input fields. I have messed with the code quite a bit to try to match the padding, color and background picture.png used for the input fields, but am getting less than desirable results.
There are a couple of other little annoyances that I've had to figure out the hard way as well. The actual dropdown background assumes the color that you've set for your form color (despite the form being an image.) I found this out by having transparency set for the form background color and then coding my HTML body to Black. I couldn't figure out why the dropdown field was always black! This doesn't affect the "select" state, just the dropdown.

See images below:

http://www.slickartsforms.com/cc-help-images/example2-form-CSS-mis-match.png
http://www.slickartsforms.com/cc-help-images/example-form-CSS-mis-match.png

http://www.slickartsforms.com/cc-help-images/example2-form-CSS-mis-match.png
http://www.slickartsforms.com/cc-help-images/example2-form-CSS-mis-match.png

The second thing is the classes for the dropdown and list boxes are not part of the "common" responsive size structuring in "default.css". There are no parameters for "large, default, small modes." Could this also contribute to the style mismatch?

Any tips on making these dropdowns look consistent with the input boxes or do I have to use a different jQuery menu plugin to substitute for those classes or something?

My wish is that in Form Builder you could specify the color of the backdrop and the text inside of it
as well as the have the default styling for the select area match that of the input fields.

Thanks!
User 122279 Photo


Senior Advisor
14,459 posts
Online Now

Your images were not found...
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2482323 Photo


Registered User
4 posts

Sorry about that- I'm trying S-Drive out for the first time ---

http://www.slickartsforms.com/albums/project-examples/

You'll find both in this album.
User 2482323 Photo


Registered User
4 posts

Here's a link to the finished form if anyone is interested in seeing the result of changing the color of the dropdown background.

http://www.hockeybythebay.com/test/forms/player-registration/player-registration.html

I also included another screen shot showing where in the HTML code I tweaked it.

http://www.slickartsforms.com/albums/project-examples/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.