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.

Question about responsive masthead in Vantage theme

Open 3 replies premiumthemetheme-vantage
M.B. Urbański
10 years ago · Last reply by Andrew Misplon 10 years ago

Hello,

I would like to ask you about a solution of one problem.
I have problem to make a responsive masthead in mobile phones.
In Custom CSS I have:

/* Full header logo */
header#masthead {
padding: 0 !important;
}
header#masthead hgroup {
padding: 0 !important;
}
header#masthead hgroup .logo img {
width: 1080px;
}
.main-navigation {
margin: 0 !important;
}
body.responsive header#masthead hgroup .support-text, body.responsive header#masthead hgroup #header-sidebar {
display: none !important;
}

When I try to open a website in mobile phone it dosen’t work good.
If you can please, help mi to resolve this problem.

Best regards,

Martin

URL: http://www.geomap.katowice.pl/

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

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Andrew Misplon Staff 10 years, 11 months ago

    Hi Martin

    Try the following under Appearance > Custom CSS:

    header#masthead {
  background-size: 100%;
  background-repeat: no-repeat;
}
@media (max-width: 680px) {
header#masthead .hgroup {
padding-top: 95px;
padding-bottom: 0;
}
}

    It’ll remove the header widget area below 680px, I think that works best. It can be done differently if required.

  2. M.B. Urbański 10 years, 10 months ago

    Hi Andrew,

    Thank you very much for an answer.
    It is working very good, but I have one more question in this topic.
    When I open the website on smartfon it's look like this (image below).
    My question is – it is possible to reduce distance between a masthead and menu?

    I would like to aks one more question. After last update to newest version of WordPress I have some problems with distanace of the box on the end of the site. If you can please write me where can I change the distance of the box to get it in the one line (grey and yellow).

    ​
    Thank you very much for your help.

    Best Regards,

    Martin
    ​

    2015-03-17 14:28 GMT+01:00 Andrew Misplon <
    forum+9282-u19173-e47205c9e8a3afdaa34f8dbdb283bfd203d977f0@siteorigin.com>:

  3. Andrew Misplon Staff 10 years, 10 months ago

    Hi Martin

    Sorry, the forum unfortunately can’t attach images from emails just yet.

    In the Custom CSS I sent, there is a 95px value. You could reduce that to 89px and it would cut 6px out from the masthead on mobile.

    Try adding the following to Appearance > Custom CSS to help out the background image:

    /* Background Image */
body.custom-background {
  background-repeat: no-repeat;
  background-size: 100%;
}

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