after updating from Version 3.0 to 3.1 table column spacing margin or padding are gone, i'm usuing a bootstrap sub-theme, i added in my custom css file some padding but is not a propper solution to a responsive site.

Comments

pinueve created an issue. See original summary.

hockey2112’s picture

Yep, same issue here. Had to manually add CSS to get my tables to look like they did before the update.

On the old version of my site's page, the table had these classes: tablefield table table-hover table-striped sticky-enabled tableheader-processed sticky-table

On the new version after the update, the table has these classes instead: tablefield sticky-enabled tableheader-processed sticky-table

Any easy fix for this, other than manual CSS?

lolandese’s picture

Looking at the Release notes with the changes since 7.x-3.0 it looks like #2877380: Make striping (odd/even class) optional might be responsible for at least the class table-striped to have vanished.

Needs analysis by:

  • checking if enabling striping on the table (in the field display options) gives us back one or both of the classes
  • rolling back the patch there and see if it restores the previous behavior to know if it is indeed the culprit for one or both disappeared classes.
lolandese’s picture

hockey2112’s picture

In case it helps anyone, here is the CSS I added to my theme to accommodate the new Tablefield formatting:

table {
background-color: transparent;
max-width: 100%;
}
th {
text-align: left;
}
table {
margin-bottom: 20px;
width: 100%;
}
table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td {
border-top: 1px solid #dddddd;
line-height: 1.42857;
padding: 8px;
vertical-align: top;
}
table > thead > tr > th {
border-bottom: 2px solid #dddddd;
vertical-align: bottom;
}
table > caption + thead > tr:first-child > th, table > colgroup + thead > tr:first-child > th, table > thead:first-child > tr:first-child > th, table > caption + thead > tr:first-child > td, table > colgroup + thead > tr:first-child > td, table > thead:first-child > tr:first-child > td {
border-top: 0 none;
}
table > tbody + tbody {
border-top: 2px solid #dddddd;
}
.table-condensed > thead > tr > th, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > td {
padding: 5px;
}
.table-bordered {
border: 1px solid #dddddd;
}
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
border: 1px solid #dddddd;
}
.table-bordered > thead > tr > th, .table-bordered > thead > tr > td {
border-bottom-width: 2px;
}
.tablefield > tbody > tr:nth-child(2n+1) > td, .tablefield > tbody > tr:nth-child(2n+1) > th {
background-color: #f9f9f9;
}
.tablefield > tbody > tr:hover > td, .tablefield > tbody > tr:hover > th {
background-color: #f5f5f5;
}
table col[class*="col-"] {
display: table-column;
float: none;
}
table td[class*="col-"], table th[class*="col-"] {
display: table-cell;
float: none;
}
table > thead > tr > td.active, table > tbody > tr > td.active, table > tfoot > tr > td.active, table > thead > tr > th.active, table > tbody > tr > th.active, table > tfoot > tr > th.active, table > thead > tr.active > td, table > tbody > tr.active > td, table > tfoot > tr.active > td, table > thead > tr.active > th, table > tbody > tr.active > th, table > tfoot > tr.active > th {
background-color: #f5f5f5;
}
table > thead > tr > td.success, table > tbody > tr > td.success, table > tfoot > tr > td.success, table > thead > tr > th.success, table > tbody > tr > th.success, table > tfoot > tr > th.success, table > thead > tr.success > td, table > tbody > tr.success > td, table > tfoot > tr.success > td, table > thead > tr.success > th, table > tbody > tr.success > th, table > tfoot > tr.success > th {
background-color: #dff0d8;
}
.tablefield > tbody > tr > td.success:hover, .tablefield > tbody > tr > th.success:hover, .tablefield > tbody > tr.success:hover > td, .tablefield > tbody > tr.success:hover > th {
background-color: #d0e9c6;
}
table > thead > tr > td.danger, table > tbody > tr > td.danger, table > tfoot > tr > td.danger, table > thead > tr > th.danger, table > tbody > tr > th.danger, table > tfoot > tr > th.danger, table > thead > tr.danger > td, table > tbody > tr.danger > td, table > tfoot > tr.danger > td, table > thead > tr.danger > th, table > tbody > tr.danger > th, table > tfoot > tr.danger > th {
background-color: #f2dede;
}
.tablefield > tbody > tr > td.danger:hover, .tablefield > tbody > tr > th.danger:hover, .tablefield > tbody > tr.danger:hover > td, .tablefield > tbody > tr.danger:hover > th {
background-color: #ebcccc;
}
table > thead > tr > td.warning, table > tbody > tr > td.warning, table > tfoot > tr > td.warning, table > thead > tr > th.warning, table > tbody > tr > th.warning, table > tfoot > tr > th.warning, table > thead > tr.warning > td, table > tbody > tr.warning > td, table > tfoot > tr.warning > td, table > thead > tr.warning > th, table > tbody > tr.warning > th, table > tfoot > tr.warning > th {
background-color: #fcf8e3;
}
.tablefield > tbody > tr > td.warning:hover, .tablefield > tbody > tr > th.warning:hover, .tablefield > tbody > tr.warning:hover > td, .tablefield > tbody > tr.warning:hover > th {
background-color: #faf2cc;
}

liam morland’s picture

Status: Active » Closed (outdated)

Drupal 7 is no longer supported. If this applies to a supported version, please re-open.

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.