Is there a way to hide table rows without affecting the overall table width? I've got some javascript that shows/hides some table rows, but when the rows are set to display: none;
, the table with shrinks to fit the contents of the visible rows.
Word tables don't offer the same functionality as an Excel workbook, but formatting the entire row as hidden does hide the entire row. As for going to a particular row, pressing Shift-F5 when you open a document (or after making an edit) should return you to the location of the last edit.
Change row height, and then drag the boundary. To set the row height to a specific measurement, click a cell in the row that you want to resize. On the Layout tab, in the Cell Size group, click in the Table Row Height box, and then specify the height you want.
To use the CSS overflow property with its "hidden" value on the HTML <td> element, you need to set the table-layout property with the "fixed" value and an appropriate width on the <table> element. Then, you need to add the overflow property set to "hidden" and white-space property set to "nowrap" on the table cell.
A hidden attribute on a <tr> tag hides the table row. Although the table row is not visible, its position on the page is maintained.
If you are looking to preserve the overall width of the table, you can check it prior to hiding a row, and explicitly set the width style property to this value:
table.style.width = table.clientWidth + "px";
table.rows[3].style.display = "none";
However, this may cause the individual columns to reflow when you hide the row. A possible way to mitigate this is by adding a style to your table:
table {
table-layout: fixed;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With