Skip to content
This repository was archived by the owner on Aug 29, 2025. It is now read-only.

💯 add percent examples #116

Merged
cldougl merged 2 commits into from
Oct 2, 2018
Merged

💯 add percent examples #116

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e98dfd8
:100: add percent examples
cldougl Oct 1, 2018
877dd7c
:memo: title/example clarification
cldougl Oct 1, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 35 additions & 0 deletions tests/dash/app_sizing.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,37 @@ def layout():
"""
),
html_table(df, table_style={"width": "100%"}, base_column_style={}),
section_title("HTML Table - All Column Widths defined by Percent"),
html.Div(
"""
The column widths can be definied by percents rather than pixels.
"""
),
html_table(
df,
table_style={"width": "100%"},
column_style={
"Date": {"width": '30%'},
"Election Polling Organization": {"width": '25%'},
"Dem": {"width": '5%'},
"Rep": {"width": '5%'},
"Ind": {"width": '5%'},
"Region": {"width": '30%'},
},
),
section_title("HTML Table - Single Column Width Defined by Percent"),
html.Div(
"""
The width of one column (Region=50%) can be definied by percent.
"""
),
html_table(
df,
table_style={"width": "100%"},
column_style={
"Region": {"width": '50%'},
},
),
section_title("HTML Table - Columns with min-width"),
html.Div(
"Here, the min-width for the first column is 130px, or about the width of this line: "
Expand Down Expand Up @@ -250,6 +281,10 @@ def layout():
),
section_title("Dash Table - Padding"),
# ...
section_title("Dash Table - All Column Widths by Percent"),
# ...
section_title("Dash Table - Single Column Width by Percent"),
# ...

@chriddyp chriddyp Oct 1, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and then add the second example here?

section_title("Dash Table - Underspecified Widths"),
# ...
section_title("Dash Table - Widths that are smaller than the content"),
Expand Down