text-overflow ellipsis where to put it

  • Resolved nontraditional

    (@nontraditional)


    2 years ago

    Hi!

    How can I add Text-overflow: Ellipsis to a headline? I used ‘Inspect page’ option with Chrome to figure it out but nothing works. Now after almost 4 hours of trying I’m starting to give up and ask for help.

    I’m absolutely missing something here because I just can’t seem to find where to put the code.

    Thanks in advance!

    Regards, Josh

Viewing 4 replies - 1 through 4 (of 4 total)
  • fazanash

    (@fazanash)

    .elementor-widget-posts .elementor-post__title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%; /* set your desired width */
    }

    Thread Starter nontraditional

    (@nontraditional)

    Hi, thanks for your reply!

    Unfortunately it did not work. I’ve tried to add it to the ‘custom css’ in the ‘section’, column’, ‘inner section’, ‘column’ and ‘headline’. Nothing works.

    Ive made a screenshot of the Elementor widget. https://www.imagebam.com/view/MEJDXWV

    Do you have some other ideas maybe? Thanks!

    Thread Starter nontraditional

    (@nontraditional)

    I resolved it myself.

    Put this in Custom css:

    .elementor-heading-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    }

    In my case I put it in the head title elementor widget.

    I’ve learned that text-overflow: ellipsis does not work without ‘overflow’ and ‘white-space’.

    israelaz

    (@israelaz)

    Hi

    Can you please send me a link to your site?

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘text-overflow ellipsis where to put it’ is closed to new replies.