Check lists on different lines

Dash Python
1

I want all of my check lists to be on different lines but right now they are right next to each other. If I add html.Br() in between checks it breaks. I’ll include my current code and a picture.

dcc.Checklist(id='my-checklist',
                                options=[
                                    {'label': 'Social Security', 'value': 'ss'},
                                    {'label': 'Supplemental Security Income (SSI)', 'value': 'ssi'},
                                    {'label': 'Unemployment', 'value': 'unemp'},
                                    {'label': 'Earned Income Tax Credit', 'value': 'eitc'},
                                    {'label': 'Child Tax Credit', 'value': 'ctc'},
                                    {'label': 'Snap (food stamps)', 'value': 'snap'},
                                    {'label': 'Energy Subsidy (LIHEAP)', 'value': 'energy'}
                                    
                                ],
                                value=[]

image

2

It seams that you should use labelStyle={‘display’: …} with the appropriate option.
See the difference between both Checklist showed in the documentation:

1 Like
3

Thanks very much. Any idea where I can find the Display options?

4

All the Styles are CSS options, you could lern about each one in the following link:

See that in the left menu you can find all the different alternative options.