Question about updating legacy sheet to CSE

Hello ! I decided to update my custom sheet to CSE standard, using the method described here : <a href="https://wiki.roll20.net/Character_Sheet_Enhancement" rel="nofollow">https://wiki.roll20.net/Character_Sheet_Enhancement</a> (mostly removing "sheet-" from the CSS). Everything is almost fine, except for the drop down menus : instead of displaying only an arrow and the options if you click on it, it displays all the options on the same line from left to right. It messed up the whole sheet, and it's not clickable. Here's the display with legacy (which is good) : <a href="https://ibb.co/g61Cqcm" rel="nofollow">https://ibb.co/g61Cqcm</a> Here's the display with CSE : <a href="https://ibb.co/rtw89SF" rel="nofollow">https://ibb.co/rtw89SF</a> And here's the CSS part that is involved (at least I think so) : select{ &nbsp;&nbsp;&nbsp; width: auto; &nbsp;&nbsp;&nbsp; margin: 0px 0px 0px 0px; &nbsp;&nbsp;&nbsp; padding: 0px 2px 0px 2px; &nbsp;&nbsp;&nbsp; font-family: "Patrick Hand"; &nbsp;&nbsp;&nbsp; font-size: 14px; &nbsp;&nbsp;&nbsp; font-weight: bold; &nbsp;&nbsp;&nbsp; border: none; &nbsp;&nbsp;&nbsp; background-color: transparent; &nbsp;&nbsp;&nbsp; box-shadow: none; &nbsp;&nbsp;&nbsp; -webkit-appearance: none; &nbsp;&nbsp;&nbsp; -moz-appearance: none; &nbsp;&nbsp;&nbsp; cursor: n-resize; } select.selprog{ &nbsp;&nbsp;&nbsp; padding: 0px 0px 0px 0px; &nbsp;&nbsp;&nbsp; font-size: 16px; &nbsp;&nbsp;&nbsp; font-weight: normal; &nbsp;&nbsp;&nbsp; color: black; } Do you people have an advice or solution with this problem ?

Hi Fred, is there a "size" attribute included in your html select?&nbsp; If so, try removing that. (although I don't it would actually cause the issue you are seeing...)&nbsp; Also have a look for any css that styles 'option' and make sure it's not set to an inline position. Normally option defaults to position: block; I believe it could be the combo of those two settings causing the issue. Perhaps there is some style overriding the position of the option element? Also, I would recommend including ".charsheet" in front of your css definitions ie '.charsheet select.selprog {...}' to help raise the specificity of your style over roll20's defaults. Probably not the issue here, but you may find things aren't changing as expected in your css and it could be a specificity conflict with the vtt.

I'm not a CSS expert, but I don't see anything in that code that would make the select appear the way it is appearing, so I would guess the problem is somewhere else. You should share the HTML for that select and whatever div is cobntained within. You might need to share the entire HTML and CSS for the sheet (put them in a separate file).

Thank you for your answers ! There is no size attribute in the HTML select. Here's the HTML of the part diplayed in the pictures I posted (all my select menus are coded the same way ) : &lt;div class="tcell"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;SELECT name="attr_protection_armure" title="Protection"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION value="-"&gt;&amp;#9660;&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;1&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;2&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;3&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;4&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;5&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;6&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;7&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;8&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;9&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/SELECT&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;input type="checkbox" name="attr_pparmure" value="1" class="dispchk" title="Porté" /&gt;&lt;span&gt;P&lt;/span&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;input type="number" class="carac numtxt" name="attr_penarmure" style="width: 30px; height: 26px;" placeholder="Pén" title="Pénalité Encombrement" /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;

Hmm.&nbsp; There isn't anything there that would cause those option's to be inline like that.&nbsp; There must be something else in the css that is forcing it. You can try forcing display: block; as a test to learn if display is indeed the issue. example (add to your css); .ui-dialog .charsheet select option { &nbsp; display: block !important; } I would recommend using the browser's inspect element tool to investigate anytime/all the time you are working with css.&nbsp; Right-click on a sheet's select and choose inspect.&nbsp; Click on one of the option elements and you should be able to see the various style properties that are affecting it. If you're issue still isn't resolved just post a link to your code. (DM is fine as well)&nbsp; I'm very curious how the options would get a horizontal without purposely styling for it.

Interesting - I never considered that there might be some specific styling on the option elements, but looking at the original picture that is possible.

GiGs said: Interesting - I never considered that there might be some specific styling on the option elements, but looking at the original picture that is possible. Same. Not sure of a use case, but I suppose it may come up for something. ;-) I found people that presented a way to make the select display horizontally. example:&nbsp; adding size="2" to the select and setting the option to display: inline; So this seems odd for it to accidentally display that way.

Using size with select (in the normal vertical dropdown) defines how many items are visible in the dropdown. I havent used display:inline, and I agree, having a horizontal list seems odd.

Hello, I added .ui-dialog .charsheet select option { &nbsp; display: block !important; } to my css but nothing changes. I noticed that some "select menu boxes" merged with text boxes next to them on the right (but some other were left unchanged). I also inspected the code, to be honest I don't understand what I see. I'd be gratefull to link my code, but I don't know what DM means (dungeon master ? ;) ) I can copy paste the code here or whatever way suits you.

Don't copy paste the code here, it'll be unreadable. The easiest ways are to copy it into pastebin.com or gist.com, and paste the link here. DM means direct message.

Oh ok, thanks. so here's the HTML : <a href="https://pastebin.com/4QiXgKpm" rel="nofollow">https://pastebin.com/4QiXgKpm</a> And here's the CSS : <a href="https://pastebin.com/45ZgEeAD" rel="nofollow">https://pastebin.com/45ZgEeAD</a>

Hi Fred, I had a quick look at your code and I believe there are some issues that need to be resolved before solving the select/option mystery.&nbsp; The page wouldn't even load properly for me with html/css provided... so that was a clue that something is not right. (this is in custom game w/legacy unchecked. I tried with and w/out legacy. no change.) I noticed that just above the first css declaration there was an usage of curly brackets. } } div, button, textarea, span, input, select{ box-sizing: border-box; } That alone can cause issues with your css.&nbsp; Great, I tried removing those and the page still would not load properly.&nbsp; A quick look over the rest of the css and I didn't see anything being flagged as malformed or broken but there definitely could be other issues in the css. Must be the html then.&nbsp; Had a look and while nothing seems broken I couldn't not fold/unfold sections of the html which is an indication that there are problems in the structure and/or syntax.&nbsp; I ran the html portion through an online check for un-closed tags&nbsp; <a href="https://www.aliciaramirez.com/closing-tags-checker/" rel="nofollow">https://www.aliciaramirez.com/closing-tags-checker/</a> So, I would see if you can correct those issues first and repost the code.&nbsp; I have a feeling that you may solve your OP problem collaterally once these issues are corrected.

Also, you'll need to point out the line numbers of the part you want us to check for issues (where is that select?)

Just looking through the html to see if there's an obvious issue and came across an unclosed select (line 1027) &lt;div class="inps"&gt; &lt;SELECT name="attr_locabg" style="width: 300px; height: 26px;" title="Localisation"&gt; &lt;OPTION value="-"&gt;&amp;#9660;&lt;/OPTION&gt; &lt;OPTION&gt;Tronc (-20 COM FOR MVT SRV TIR)&lt;/OPTION&gt; &lt;OPTION&gt;Bras (-20 COM FOR HAB SRV TIR)&lt;/OPTION&gt; &lt;OPTION&gt;Jambe (-20 COM DIS FOR MVT SRV)&lt;/OPTION&gt; &lt;OPTION&gt;Tête (-20 CNS MAG PER SOC TIR)&lt;/OPTION&gt; &lt;/div&gt; I have a feeling you may find more of those. Do a search for "&lt;SELECT" and another for "&lt;/SELECT". If you see there are 60 results for "&lt;SELECT" and only 40 for "&lt;/SELECT", you are missing the closing tags for those. ( update/edit: did a quick search and didn't see any other unclosed selects, but fixing the one still didn't fix my display issue with the sheet. ;-( ) I would also recommend keeping all your tag names lowercase. Although html tags are case insensitive, it's just good practice for anyone following the code and consistency.

An update for Legacy to CSE can expose a lot of issues that already existed in the hseet but had been overlooked before.

Thanks gentlemen ! here's the html with all tags closed now (according to <a href="https://www.aliciaramirez.com/closing-tags-checker/" rel="nofollow">https://www.aliciaramirez.com/closing-tags-checker/</a> ) : <a href="https://pastebin.com/832XzRDx" rel="nofollow">https://pastebin.com/832XzRDx</a> and the CSS without the { } at the begining. <a href="https://pastebin.com/zmadQm0J" rel="nofollow">https://pastebin.com/zmadQm0J</a> However it still doesn't work. I'm pretty sure this html is kind of dirty because I'm not into coding and computer at all. But this character sheet loads without problem (with legacy unchecked) on mozilla. and is fully functional except for the select menu issue (there are still some other minor issues, for example the default d20 icon for roll buttons to get rid of, but no big deal). @Vince : your screenshot looks like my sheet when I check legacy in the game parameters. Here's what it looks like with legacy unchecked <a href="https://ibb.co/pZBbwf7" rel="nofollow">https://ibb.co/pZBbwf7</a> The original sheet (legacy) is also fully functional and works fine for my players also (using mozilla or chrome). @ Gigs : there are select all over the place :) Here are a few of them : line 1027 line 1302 line 1314 line 1326 line 1344 line 1346 line 1406 line 1445 and so on

Fred said: @ Gigs : there are select all over the place :) Here are a few of them : line 1027 line 1302 line 1314 line 1326 line 1344 line 1346 line 1406 line 1445 and so on I was asking specifically about the one that was causing issues. Are they all displaying inocrrectly? Also, imagine I know nothing about the game system and the character sheet - give me steps needed to find the problem.

There are all displaying the same way, and incorrectly. Some of them are not linked to anything (the attribute selected exists only for display purposes). For example this one allows to display a wound suffered by the character, but has no mecanical effect with the sheet :&nbsp; [ starting line 1024] &lt;div class="mycol colmid"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="coltitre"&gt;Blessure grave&lt;/div&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class="inps"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;SELECT name="attr_locabg"&nbsp; style="width: 300px; height: 26px;" title="Localisation"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION value="-"&gt;&amp;#9660;&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION &gt;Tronc (-20 COM FOR MVT SRV TIR)&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION &gt;Bras (-20 COM FOR HAB SRV TIR)&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION &gt;Jambe (-20 COM DIS FOR MVT SRV)&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION &gt;Tête (-20 CNS MAG PER SOC TIR)&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/SELECT&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt; Some of them are used by the sheetworker to calculate stuff, for example the numeric attribute selected by this one adds up with the armor class of the character : [starting line 1389] &lt;div class="tcell"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;SELECT name="attr_protection_armure" title="Protection"&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION value="-"&gt;&amp;#9660;&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;1&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;2&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;3&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;4&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;5&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;6&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;7&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;8&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;OPTION&gt;9&lt;/OPTION&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/SELECT&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;input type="checkbox" name="attr_pparmure" value="1" class="dispchk" title="Porté" /&gt;&lt;span&gt;P&lt;/span&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;input type="number" class="carac numtxt" name="attr_penarmure" style="width: 30px; height: 26px;" placeholder="Pén" title="Pénalité Encombrement" /&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt; The checkbox input following the select menu is used to check whether the armor is worn or not (if worn the numercal attribute from the select menu will apply tothe armor class and the attr_penarmure attribute (last line) will apply to some ability checks (it's a kind a encumberance malus so to speak).

I changed the case for "SELECT" and "OPTION" to lowercase and... This may be another one of those weird roll20 quirks. IDK. HTML tags are supposed to be case-insensitive. But apparently it matters. At least for non-legacy sheets.

Wow ! I don't understand what you have changed but it sure looks like the way the original legacy sheet behaves :) You mean you converted "SELECT" to "select" in the html ?

So all the select and option tags in the html were capitalized.&nbsp; I just changed them all to lowercase. As GiGs mentioned above, non-legacy/CSE handling is probably much more strict on the code requirements. legacy sheet code may have "worked" without any apparent issues, but CSE+ sheets must meet some minimal criteria.

Vince said yes. SELECT and OPTION to select and option.

Done and it works ! Thank you very very much Vince, I would never have sort this out on my own ! Thank you too for your help Gigs, I haven't forgotten that you helped me alot with the rolltemplate (of this very same sheet by the way) about 1 year ago. Now my sheet is ready for CSE in case roll20 stops the legacy support.

I learned a few things with this that I didn't know before. lol The "size" attribute can used with select's to limit the number of options seen at once. You can set option's to display: inline to get a horizontal display of the options HTML tags should all be lowercase on roll20 characters sheets otherwise they can get parsed out by the vtt. My wife doesn't seem to share the same love I have for discovering these types of peculiarities.&nbsp; :-P cheers

lol at #4. Thank you Fred. By the way, it's a bit more efficient if you put your script block at the end of the file, rather than the start.

Well, sorry for potential domestic problems, if needed I can send you a signed testimony that you made html science leap forward for the greater good of mankind :)

BTW, I put the script block at the end of the html, as advised