Display a wider picklist field?

  • 2
  • Question
  • Updated 3 years ago
  • Answered
How do I change a picklist field to display wide enough to show the full value of my entry?
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb

Posted 3 years ago

  • 2
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
Here's one solution:

Create a new In-Line CSS with the following:

.nx-editor select {max-width: 100%;
}

This does it to all fields. Would like to be able to do it on just one field. 
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,646 Points 5k badge 2x thumb
Give an ID to your field/editor, then reference it by using #ID, like so:

#YOUR_ID .nx-editor select {
    max-width: 100%;
}
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
I couldn't get that to work. Field doesn't have an option for a unique id. I changed code to #wide .nx-editor select and then put wide in the unique id for the field editor and it didn't work.

I think I should be able to just rename the css to .widePicklist and apply that CSS to the field but I can't get that to work either. 

It's actually pretty nice to have all the picklists at 100%
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
I figured out what I was doing wrong before with not getting the CSS to be on just one field. I needed to include the select function
.widePicklist select {
    max-width: 100%;
}
And then I put widePicklist into the CSS on my field.