I would like to override following CSS styling defined for all tables:
table {
font-size: 12px;
width: 100%;
min-width: 400px;
display:inline-table;
}
I have specific table with class called 'other'
.
Finally table decoration should looks like:
table.other {
font-size: 12px;
}
so i need remove 3 properties: width
,min-width
and display
I tried to reset with none
or auto
, but didn't help, I mean these cases:
table.other {
width: auto;
min-width: auto;
display:auto;
}
table.other {
width: none;
min-width: none;
display:none;
}
I believe the reason why the first set of properties will not work is because there is no auto
value for display
, so that property should be ignored. In that case, inline-table
will still take effect, and as width
do not apply to inline
elements, that set of properties will not do anything.
The second set of properties will simply hide the table, as that's what display: none
is for.
Try resetting it to table
instead:
table.other {
width: auto;
min-width: 0;
display: table;
}
Edit: min-width
defaults to 0
, not auto