Table Formatting - Reduction of row height - Dawn Theme

Hi,

Could somebody help me and explain where exactly I need to modify the code to reduce the row height in the tables that are on the product page within the Dawn theme? (I had a similar issue with the Debut theme before and managed to fix it but no chance this time…)

Here is an example from my shop: https://getabottle.de/products/aberfeldy-18-jahre-2021-exceptional-cask-series-double-cask-limited-edition-0-7l-53-3-vol

Part of my product description is a table with additional information. The issue is that there is so much empty space in each cell on the top and bottom and I would like to have the different rows of the table to be as close together as possible to use less vertical space on my page.

Thank you very much in advance.

Hi!

Try adding this code to the bottom of the base.css

.rte table td{
  line-height: 0.8;
  padding-top: 1px;
  padding-bottom: 1px;
}

Thank you for the prompt reply.

For the line height, I had to move it back to 1, as otherwise the text that goes over two lines looks squeezed.

And my main issue is the space highlighted in red. I want to eliminate that particular space. With the code suggestion provided, it only marginally decreased the gaps unfortunately. Maybe there is another solution?

You could try to add this code instead

table:not([class]) td, table:not([class]) th {
  padding-top: 0;
  padding-bottom: 0;
}

.rte table p {
  margin: 0;
}

Fantastic! Double thumbs up! That solved the problem and is exactly the solution I was looking for.

Thank you very much.

Excellent, I’m glad the issue is solved!

Hi! I have the exact same issue, but I have tried to copy the code but it just stays as plain text… Where exactly should I paste the code? (Sorry, I’m new to “coding” :slightly_smiling_face: )

I have the same question. Where do you paste this code into?