1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Apply line-height on h1

Discussion in 'Free Divi Community Forum' started by RobertaCin, May 5, 2020.

  1. RobertaCin

    RobertaCin Member

    How comes when you try to add line-height in .em it doesn't work in elements such as h1?
    I would like this title to appear in two rows without using two modules.
    please see this page and screenshot.
    https://sailover.net/servizi/exclusive/notte-a-bordo/

    thank you
     

    Attached Files:

    1. PRO MEMBER PERKS Divi Ultimate Archive Plugin - Tons of elegant premade sidebar styles to choose from for your Divi site:Learn More
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    Line height is the spacing between text in different row. It doesn't move your text into multiple row.

    To make your title into 2 row, you will need to set the width smaller, so that the title doesn't fit in 1 row.
     
  3. RobertaCin

    RobertaCin Member

    I know what is line-height and this is why I used a /br tag to make the title in two rows which I suppose should be fine and work with line-height. My question is in fact why line-height seems doesn't work on h1. Maybe it's a divi issue I don't know. Usually, line-height works everywhere on the site.

    thanks
     
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    Looks fine to me. I recorded a video to demonstrate it: https://recordit.co/VYwhaCamM7
     
  5. RobertaCin

    RobertaCin Member

    Dear Divi Helper,

    thanks for your kind support and making a video of your inspect element, unfortunately setting up line-height works on inspect element but for reason I ignore does not work in the website code. I will upload details shortly.
     
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add more varieties for your Divi header (12 premade styles) + menu hover effects:Learn More
  6. RobertaCin

    RobertaCin Member

    Sorry, please dismiss the previous message, I cannot edit it anymore
    The issue is that editing the line-height works on mobile and tablet but not on desktop
    In the screenshot, you can see the pretty big gap between two H1 Headings and also a gap I would like to make smaller between h6 and h1

    Page involved in the test is https://sailover.net/servizi/exclusive/giornalieri/half-day/

    thank you
     

    Attached Files:

  7. Divi.Help

    Divi.Help Administrator
    Staff Member

    Seems like it's because your h2 tag is wrapped with span tag & the span font-size is different (smaller) from your h2 font size. That's why it's resulting in unwanted spacing.

    upload_2020-5-12_22-17-40.png
     
    RobertaCin likes this.
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom header designs for you to choose from:View Demo
  8. RobertaCin

    RobertaCin Member

    issue sorted, thanks