Table Formatting - Reduction of row height - Dawn Theme

Solved
CNOS
Tourist
5 0 1

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-e...

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.

0 Likes
Nick_Marketing
Shopify Partner
681 167 198

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;
}
- I am an eCommerce and Marketing Technology consultant based in Toronto, CANADA.
- To inquire about consulting work availability, please send me a Private Message.
- For Shopify Tutorials, Subscribe to my YouTube Channel.
CNOS
Tourist
5 0 1

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?

EEA93C6F-17D7-4172-8744-5933C0CFFF90.jpeg

0 Likes
Nick_Marketing
Shopify Partner
681 167 198

This is an accepted 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;
}

 

2021-09-22 16_53_07.png

- I am an eCommerce and Marketing Technology consultant based in Toronto, CANADA.
- To inquire about consulting work availability, please send me a Private Message.
- For Shopify Tutorials, Subscribe to my YouTube Channel.
CNOS
Tourist
5 0 1

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

Thank you very much.

Nick_Marketing
Shopify Partner
681 167 198

Excellent, I'm glad the issue is solved!

- I am an eCommerce and Marketing Technology consultant based in Toronto, CANADA.
- To inquire about consulting work availability, please send me a Private Message.
- For Shopify Tutorials, Subscribe to my YouTube Channel.
0 Likes