CODEWITHSUNDEEP
htmlcssfirefoxprinting
Marius Grigaitis
Marius Grigaitis

Reputation: 2520

Firefox table border print 2px renders border as 1px

HTML

<table class="bad">
    <tr>
        <td>test</td>
    </tr>
</table>

<table class="ok">
    <tr>
        <td>test</td>
    </tr>
</table>

CSS:

table {
    border-collapse: collapse;
}

table.ok {
    border: 1px solid black;
}

table.bad {
    border: 2px solid black;
}

http://jsfiddle.net/BD248/

Printing such HTML yields same border on both tables in Firefox.

Other browsers such as Chrome prints thicker border on .bad

How do I fix / workaround that?

Setting 3px border on .bad yields "thick" border on Firefox, which looks ugly.

Upvotes: 4

Views: 1507

Answers (1)

Gilbert
Gilbert

Reputation: 21

I ran into the same problem. It is not only related to Tables. It also applies to div elements. Use pt (points) as a unit for printing instead of px (pixels). Try:

div {border: 2pt solid red}

Upvotes: 2

Related Questions