How can I reduce line spacing in the Dawn theme?

[mactac]

I find that the line spacing for content (ie the space between each line of just regular text) is just a little bit too large - it almost seems doubled spaced.   How do I reduce the line spacing by maybe 20%?

[cateb]

Theme -> Actions -> Edit Code -> base.css

search for line-height

edit as desired

I would probably just lower the decimal number in the calculation first to find what looks best.

[mactac]

I found this:

.text-body {
font-size: 1.5rem;
letter-spacing: 0.06rem;
line-height: calc(1 + 10.8 / var(--font-body-scale));
font-family: var(--font-body-family);
font-style: var(--font-body-style);
font-weight: var(--font-body-weight);
}

but if I make changes (editing the 0.8 part) it doesn't seem to make any difference at all to the text

[Denishamakwana]

Welcome to shopify community.

Please share your store URL and if your store is password protected then please provide password too.

Thank you.

[mactac]

I don't have th emodified store live yet, but this is a share of the preview, good for 2 days:

https://8rorhjdqk1vtgxmf-17245213.shopifypreview.com

[mactac]

Bump....

[mactac]

Anyone?

[mactac]

bump....

[Julia777]

Hey! I just found a solution with the inspector that worked for me. I was trying to adjust the line spacing of a specific section of image with text.

Try the following codes at the bottom of your base.css file

Line spacing for image with text sections:

div.image-with-text__text.rte.body  {
     line-height: calc( 1.5 / var(--font-body-scale));
  
}

Play with the 1.5 number until you get it right. 

To adjust the other sections, go to your website and select the text area you wish to adjust. Right click to open inspector and hover to find the class code. In the above example, the class code is 

''div.image-with-text__text.rte.body.'' Hover to make sure you get the right code.

You can then use the above template and change the class code to edit other areas, such as image-with-text areas or whatever layout you have. 

[ces1987]

Thank you!!!

[Julia777]

Here's the code to edit the body text line spacing across the whole website

Edit theme -> edit code -> paste the following code at the bottom of the base.css file

body {
    line-height: calc( 1.5 / var(--font-body-scale));
}

 change 1.5 to the number you prefer

Hope this helps!

[CP6]

I have a similar question about spacing between paragraphs. For example, in the multicolumn section, if there's more than one paragraph of text, it's hard to tell there is actually a second paragraph, making the text look very dense. Any suggestions?

[abelarts]

yeah, same issue here. It's super annoying and makes no sense why you can't space out paragraphs.

[johnsonjasonb]

I added this code and played with the numbers. No matter what number I plugged in, it didn't seem to make a difference.