Spacing bug on Select questions with appearance minimal


The width of the select doesn’t grow to wrap the long option.
Screenshot from 2023-09-12 22-35-19

It’s however displayed correctly if i remove the white-space css rule or change it to another value
Screenshot from 2023-09-12 22-35-38

result
Screenshot from 2023-09-12 22-36-08

There are no spaces at the beginning or end of the string so I’m not sure why it puts the string on a new line in the first place.

1 Like

@Fred I suspect it’s because that option is quite long and it’s probably an edge case bug. To gather some more info it would be good to know what white-space setting it’s defaulting to - if you switch to “computed” tab in the dev tools it’ll show you if it’s inheriting a style from somewhere or using the default. Also try editing the source and adding spaces around the / to see if it wraps cleanly. One more thing to try is editing the source and making the name much longer with no spaces and seeing what happens.

The styling was added last year. @jkuester Do you have any recollection of what the style is there for?

Here’s the computed tab
Screenshot from 2023-09-13 02-46-25

With spaces around /
Screenshot from 2023-09-13 02-48-37

With a long string
Screenshot from 2023-09-13 02-49-27

With a very long string, has a horizontal scrollbar

Long string with spaces

Right, so it definitely looks like a problem with long strings and no spaces. We might also want to make it a little bit wider by default.

I’ve raised a bug here: Options with long names look wrong in enketo selects · Issue #8541 · medic/cht-core · GitHub

4 Likes