Geek asks and answers

Losing column width when printing an HTML table

I have a page that will be used (and therefore styled) for printing only. When I view a page in a browser, the column width is set the way I set them:

<table>
<col width="20%">
<col width="25%">
<col width="5%">
<col width="10%">
<col width="17%">
<col width="15%">
<col width="8%">
<thead>
      header columns
</thead>
<tbody>
      columns
</tbody>
</table>

However, when I print the page, the columns have the same widths. Can I set columns as a percentage (or in general) when printing?

+5
source share
1 answer

Try to use <table style="table-layout: fixed;">.

This will force the table to use the specified widths.

Historically, the width of the columns of a table has always been more of an “assumption” for the browser, and to some extent was more like min-width. Customization table-layout: fixedwill get around this.

+13
source

More articles:


All Articles