Joomla Templates Club 406,261 posts

[jonnz Friend jonnzJoin date: February 2012Posts: 35Downloads:10Uploads:6]

#891593

Hi
I would like to know how to set the line spacing in all articles. I am using Uber wedding and the line spacing is too great.
I have set up a class in the custom.css which I currently apply using a span tag but it would be easier if I could set a default line spacing.

[timtecsa Friend timtecsaJoin date: October 2009Posts: 1382Downloads:86Uploads:327 Thanks: 197 Thanked: 132 times in 34 posts]

#891594

Do you know how to use Inspect element in Chrome browser? If not, try searching for ‘Inspect’ in Chrome, Help. If you then select some article text and right click > choose Inspect and you’ll see some css like ‘line-height: 12px; or line-height: 1.25; Edit the number to see the line spacing change. When you have found the number you like you are half way there.

Is your site online?

[jonnz Friend jonnzJoin date: February 2012Posts: 35Downloads:10Uploads:6]

#891607

http://www.pnghs.school.nz/2016/index.php/information
But how to edit the default line spacing in an article?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#891619

Hi
The line-height is 1.2 that is coming from the custom code added by you in custom.css file
Here : http://prntscr.com/a8vciz
You can check it via inspect element/firebug tools in your browser .

[timtecsa Friend timtecsaJoin date: October 2009Posts: 1382Downloads:86Uploads:327 Thanks: 197 Thanked: 132 times in 34 posts]

#891721

body {
    font-family: serif;
    font-size: 14px;
    line-height: 1.85714286;
    color: #505656;
    background-color: #ffffff;

Above is the global css for body text in your site. You see that the line-height is 1.85714286 which is rather large.

In your custom.css file you add the following:

body {
    line-height: 1.2;
}

Where 1.2 might be a good number but you can try others.

If you want your article content only to be another setting, try adding this to your custom.css file. Again you can choose a different number.

.article-content {
    line-height: 1.2;
}

Tim

1 user says Thank You to timtecsa for this useful post

1. Pankaj Sharma

[jonnz Friend jonnzJoin date: February 2012Posts: 35Downloads:10Uploads:6]

#892173

Thanks for that. The body code works but the .article-content doesn’t.
Any thoughts? (It would be nice to format just article text )

[timtecsa Friend timtecsaJoin date: October 2009Posts: 1382Downloads:86Uploads:327 Thanks: 197 Thanked: 132 times in 34 posts]

#892253

Maybe some clues here: https://www.joomlart.com/forums/topic/font-size-article/
@pankaj knows his css better than I do. 🙂

Tim

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#892617

Hi
the line-height code also working on your site kindly check the article page : http://prntscr.com/a9ntpa
The code is coming from your custom.css file .

[Author]

Posts