Menu icon Foundation
Foundation 5 Tables white borders

Hi,

I use tables to create calenders in my templates. In Foundation 5 they added some white border around every single cell which doesn't look great for my use case.
I tried to figure out what style property causes this, but wasn't successful..

Here the links to the docs for better understanding:
F5: http://foundation.zurb.com/docs/components/tables.html
F4: http://foundation.zurb.com/docs/v/4.3.2/components/tables.html

Help is much appreciated :)

tablesstylingborders

Hi,

I use tables to create calenders in my templates. In Foundation 5 they added some white border around every single cell which doesn't look great for my use case.
I tried to figure out what style property causes this, but wasn't successful..

Here the links to the docs for better understanding:
F5: http://foundation.zurb.com/docs/components/tables.html
F4: http://foundation.zurb.com/docs/v/4.3.2/components/tables.html

Help is much appreciated :)

Bill Bell almost 6 years ago

Do you have an example webpage? I was finally successful using Chrome's developer tools to track an issue with a form. It did take a few hours.

Duc Anh Trinh almost 6 years ago

You can see an example in the Foundation Doc from the two links I posted. The difference between F5 and F4 should be noticable :)

Sebastian Helbig almost 6 years ago

Hello Duc,

<table style="border-spacing: 0">

will help :)

Todd Miller over 5 years ago

Actually, I'm having the opposite problem. I'm using F5.2.2 and I'm not seeing the white border around every cell as it shows in the docs. I tried setting the border-spacing to 2px for all combinations of table, th, and td without luck.

Any suggestions?

Edit:

Never mind. I found that if I added border-spacing: 2px; and border-collapse: separate; to table then the white borders were there.