DOMPDF table border issue

Question

I've come across a very strange issue with the latest version of DOMPDF (0.6.0 Beta 3). I'm using it to create invoices for customers on my site. The design calls for 1px borders between the table cells. If I use either black or #000 for the border color, the tables are rendered nicely. However, when I change the color, to say #CCC for example, instead of a 1px border, the borders become 2px. I'm using border-collapse:collapse and I've been pulling my hair out over this for 2 days. I'm not changing anything else except the color, yet the border thickness is changing. Has anyone else run across this issue and know what the solution is or have any suggestions? Why does black render a 1px border but other colors are rendered as 2px borders? Help!

Edit: I also have empty cells filled with   as I read that that may cause issues with tables, but still no luck.

It's basically just my CSS　ｒｕｌｅs. For example: `border:1px solid #000;` produces a thin black line but `border:1px solid #ccc;` creates a 2px border. I can't figure out why. — user2389431, May 29 '13 at 01:46
I was unable to reproduce the issue using similar styles. So it would help to see the code you're using. Also, what version of PHP? Have you considered updating to the latest code, you can download it from [github](https://github.com/dompdf/dompdf) or the [nightly downloader](http://eclecticgeek.com/dompdf). — BrianS, May 29 '13 at 03:11
Was this ever resolved? I am using the latest build and I have the same problem with cell border widths rendering thicker when using any color other than black. I'm using PHP 5.4 and the CSS is standard CSS as used in your examples "border-bottom: 1px solid #DEDEDE;". As soon as I change the color to black, they render as 1px (probably 1pt in the PDF). — Duffy Dolan, Aug 07 '13 at 17:48

score 8 · Answer 1 · answered Jan 11 '14 at 00:18

This might help. I have not tried to reproduce your problem, but I know it helped with some issues I was having with tables. try adding this to your css for the table:

table {
    border-collapse: collapse;
}

Obviously you can use the appropriate selector in the css and not define the entire table class.

score 4 · Answer 2 · answered Jan 18 '18 at 18:54

I was having the exact same problem. It's caused from the table having its own border and the cells having their own borders. Here's how I fixed it:

table {
    border-left: 0.01em solid #ccc;
    border-right: 0;
    border-top: 0.01em solid #ccc;
    border-bottom: 0;
    border-collapse: collapse;
}
table td,
table th {
    border-left: 0;
    border-right: 0.01em solid #ccc;
    border-top: 0;
    border-bottom: 0.01em solid #ccc;
}

score 3 · Answer 3 · answered Aug 12 '20 at 09:30

3

If anyone facing problem with borders of multiple tables in a row

Replace This

table{ border:collapse; }

with

table{ border-spacing: 0; }

Reference link

answered Aug 12 '20 at 09:30

Muddasir Abbas

1,699
1
20
37

score 2 · Answer 4 · answered Mar 09 '14 at 13:29

2

I've seen some improvement by setting border thickness to 0.01em

answered Mar 09 '14 at 13:29

BobSquared

56
3

I had to actually use 0.0001em on the border thickness because I was getting border intersections that had little 1 pixel braches. My table's corners looked more like `+-----------+` corners than like squared corners. Thanks for the tip! – Michael Aug 01 '14 at 16:52

score 2 · Answer 5 · answered Apr 08 '20 at 12:22

2

Use border-spacing: -1px; Instead of border-collapse: collapse;

answered Apr 08 '20 at 12:22

Mohamed Shahid

476
5
18

DOMPDF table border issue

5 Answers5

Linked