Home>Support>Masthead alignment only in mobile

Masthead alignment only in mobile

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hello, I am working on my first WordPress site and Vantage has made it a dream. However, I have hit a snag and after over an hour of searching and trying various css I need help.

I have set my header widgets how I want them finally, but on mobile it looks terrible. The text portion is in a visual editor widget and aligned right. When I view it on a phone I need that widget to either be centered or removed. What can I do to make this happen?

Bonus question: In the header I have a phone number how can I make it clickable on phones? I currently have it set using

 <a href="tel:// 
to make it clickable on phones but this makes an invalid link on desktops and tablets.

Thank you.

URL: http://www.sportsvenuebar.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 4 months ago Daniel
    Hi, I Work Here

    Hi BPerrydore,

    Sorry for the delayed response.

    To hide the text widget on mobile devices you can add the following custom CSS:

    @media only screen
    and (max-width : 500px) {
    #pl-w550d9e09af7ee p {
      display: none!important;
    }
    }
    

    Also there is nothing you can really do about the invalid telephone link for the desktop. It is just a limitation on the part of the HTML code.

    Cheers!

  2. 10 years, 4 months ago BPerrydore

    Thank you so much. Worked perfectly.

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.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More