maildev@lists.thunderbird.net

Thunderbird email developers

View all threads

XUL checkbox sizing problem on OS X/Linux

CL
Christopher Leidigh
Wed, Aug 7, 2019 6:49 PM

I have an odd problem with <checkbox> specifically under OS X/Linux:

As shown below, LocalFolders has an options dialog with multiple checkboxes.

The problem is with the 'Add Mail Folders' section where several
checkboxes are used to select additional folders to add.

The repeated paradigm is:

checkbox folder_image label

From the screenshot you can see several of the checkboxes are displayed
very small.  The differences between the different examples

shown in the dialogue are my different attempts to solve the problem.

The first column does not constrain the folder_image.  The checkbox
renders correctly, but the image gets stretched vertically.

                        <hboxclass="folder-row">
                            <hbox>
                                <checkboxid="add_folder_inbox"oncommand="eu.philoux.localfolder.toggleSpecialFolder('inbox')"SpecialFolder="Inbox"/>
                            </hbox>
                            <imageclass="tabmail-tab"type="folder"SpecialFolder="Inbox"/>
                            <labelid="add_folderlabel_inbox"accesskey="I"control="add_folder_inbox"value="Inbox"/>
                        </hbox>

The second column adds an <hbox> around the image with size constraints
matching the actual 16x 16 size.  This makes the image correct, but
somehow completely

messes up to checkbox making very small.

                        <hboxclass="folder-row">
                            <checkboxid="add_folder_outbox"checked="true"disabled="true"oncommand="eu.philoux.localfolder.toggleSpecialFolder('outbox')"SpecialFolder="Outbox"/>
                            <hboxwidth="16px"height="16px"flex="0"maxheight="16px">
                                <imageclass="tabmail-tab"type="folder"SpecialFolder="Outbox"/>
                            </hbox>
                            <labelid="add_folderlabel_outbox"value="Outbox"/>
                        </hbox>

Finally the only way I have found to get the checkbox rendered correctly
was converted to html:input type="checkbox".

The last line in the lower yellow box  labeled "Junk 8"  shows this
example working.

I have to assume I'm just missing some box sizing trick?

Thanks

Christopher

I have an odd problem with <checkbox> specifically under OS X/Linux: As shown below, LocalFolders has an options dialog with multiple checkboxes. The problem is with the 'Add Mail Folders' section where several checkboxes are used to select additional folders to add. The repeated paradigm is: checkbox folder_image label From the screenshot you can see several of the checkboxes are displayed very small.  The differences between the different examples shown in the dialogue are my different attempts to solve the problem. The first column does not constrain the folder_image.  The checkbox renders correctly, but the image gets stretched vertically.                         <hboxclass="folder-row">                             <hbox>                                 <checkboxid="add_folder_inbox"oncommand="eu.philoux.localfolder.toggleSpecialFolder('inbox')"SpecialFolder="Inbox"/>                             </hbox>                             <imageclass="tabmail-tab"type="folder"SpecialFolder="Inbox"/>                             <labelid="add_folderlabel_inbox"accesskey="I"control="add_folder_inbox"value="Inbox"/>                         </hbox> The second column adds an <hbox> around the image with size constraints matching the actual 16x 16 size.  This makes the image correct, but somehow completely messes up to checkbox making very small.                         <hboxclass="folder-row">                             <checkboxid="add_folder_outbox"checked="true"disabled="true"oncommand="eu.philoux.localfolder.toggleSpecialFolder('outbox')"SpecialFolder="Outbox"/>                             <hboxwidth="16px"height="16px"flex="0"maxheight="16px">                                 <imageclass="tabmail-tab"type="folder"SpecialFolder="Outbox"/>                             </hbox>                             <labelid="add_folderlabel_outbox"value="Outbox"/>                         </hbox> Finally the only way I have found to get the checkbox rendered correctly was converted to html:input type="checkbox". The last line in the lower yellow box  labeled "Junk 8"  shows this example working. I have to assume I'm just missing some box sizing trick? Thanks Christopher