This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Vantage Headline multiline option

Open 5 replies premiumthemetheme-vantage
wouteryibs
11 years ago · Last reply by Andrew Misplon 11 years ago

Is there an option to introduce a multiline Vantage Headline when the screen is getting smaller? More like a responsive Vantage Headline, where the text gets smaller when the screen gets smaller and at a certain point, text becomes multiline text.

URL: http://www.formstorm.nl/

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

5
  1. Andrew Misplon Staff 11 years, 4 months ago

    Hi Wouter

    Shooting from the hip here but try:

    /* Vantage Headline Widget */

@media screen and (max-width: 960px) {

.widget_headline-widget h1 {
font-size: 26px !important;
word-break: break-all;
}

.widget_headline-widget h3 {
font-size: 14px !important;
word-break: break-all;
}

}

    Adjust the breakpoint as required and then additionally adjust the font sizes at that breakpoint, as required. the word-break property should split the lines at that point.

    Let me know how it goes.

  2. wouteryibs 11 years, 4 months ago

    Hello Andrew,

    Your solution didn’t work for me unfortunately. However, I found the solution on the web. In Appearance\Custom CSS I added:

    /* Vantage Headline Widget Responsiveness */

@media screen and (min-width: 900px){
   .rwd-break { display: none; }
}

    Furthermore, in Appearance\Editor I changed the line-height of the h3 from 0px to 25px. Now it works well!!

    .widget_headline-widget h3{
padding-bottom:20px;
margin:0;
font-size:16px;
color:#666666;
font-weight:200;
line-height: 25px;
}
  3. Andrew Misplon Staff 11 years, 4 months ago

    Unless your style.css file is a child theme you’d need to move that line-height change over to Appearance > Custom as all theme files get overwritten during theme update. Just a reminder there.

  4. wouteryibs 11 years, 4 months ago

    Didn’t know that! I just moved all my changes to Custom CSS. Thanks.

  5. Andrew Misplon Staff 11 years, 4 months ago

    For sure. Here’s our overview tutorial: https://siteorigin.com/basics/modifying-theme-design-with-custom-css/

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread