• 0

Changing line height


Question

Posted · Report post

How do I change the text line height in the custon less/css area? I have messed wiht this for hours and can't get anything to work.

Thx

Share this post


Link to post
Share on other sites

6 answers to this question

  • 0

Posted · Report post

Added this to manage line height.

<div style="line-height: 18px;">
    <span style="font-family: verdana, geneva, sans-serif; font-size: 14px; line-height: 14px;">During the discovery phase of the MCOP project, the project team examined existing documentation for MCOP requirements and conducted a thorough market analysis. &nbsp;In addition, the team gathered requirements from individuals and organizations targeted for MCOP implantation and surveyed stakeholders to establish priorities for the MCOP platform.</span>
</div>

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

hello rcpessemier

 

can we have a link to your site and examples of the code you have tried please? 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Staging site is http://biz117.inmotionhosting.com/~corpte5/psmcop.org

 

I am in this neighborhoos

.fulltabs.tabs-ugykhp .tab-pane.well.tab-ugykhp-131 {
    background-color: #D8D8D8;
    color: #000000;
}
 
and
 
<span style="font-family:verdana,geneva,sans-serif;">The Maritime Common Operating Picture (MCOP) project team conducted a discovery phase that included:</span>
 
I want to have less spce above and below the first line in the tab MCOP Overview and be able to control line height better throughout the site.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Where exactly on your homepage are these tabs, I don't see any ?

 

If you want to reduce space above/below elements, you will want to use custom CSS. I recommend inspecting the element(s) with Google Chromes Dev Tools where margin is displays as a orange color and padding as green. Then inspect the element where the margin/padding is coming from and use custom CSS to remove or reduce it.

 

In regards to line height, do the same as above, inspect the element you want to increase the line height of and add your own value. Then add this to you custom CSS. For assistance with customizing DMS see our documentation - http://docs.pagelines.com/customize/how-to-customize

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I added this and it seems to work.

<p style="margin-bottom: 0px; margin-top: 5px;">
    <span style="font-size:14px;"><span style="font-family:verdana,geneva,sans-serif;">The Maritime Common Operating Picture (MCOP) project team conducted a discovery phase that included:</span></span>
</p>

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Glad you managed to resolve, thank you for updating the thread. The method you've used is inline css, which works. But for reference the correct way would be to use the css/less panel in the DMS control panel or via a child theme. Examples below.

 

.section-fulltabs .fulltabs .tab-content p {
    line-height: 10pt;
    padding-left: 0;
}
 
The above would control the line height for the text in the section.
 
.well {
    padding: 19px;
}
 
The code above controls the padding inside the tab. http://screencast.com/t/qg1bZ3p5

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now