Home>Support>Vintage Premium: Header problem: Desktop to moblie version

Vintage Premium: Header problem: Desktop to moblie version

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].

Hi there!

I’m using the vantage theme premium.
On this moment I’m changing the Header, but there’s one problem.
When I putt widgets in the Header, I can’t get the logo and social pictures and tel.number next to each other.
The are shown under each other.

In the mobile version, this is perfect.
But on the desktop version it’s awful.

I’ve tried to put in the next command:

element.style {
margin-top: -95px;
Now it look fine on the desktop version, but the signs are mixed on the mobile version.

What can I do to get this done on all desktops, mobile, etc.?

Here are the print screens to show you what I mean.

Original
Prt sc 01 – Desktop version (wrong)
Prt sc 01 – Mobile verion (good)

with code : margin-top: -95px; (added to the social media)

Prt sc 02 – Desktop version (good)
Prt sc 02 – Mobile version (wrong)

Thanks!!

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

  1. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Hi Enjoyballonvaarten

    Thanks for your support.

    Do you have a public URL where we can take a look at what’s going on? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

  2. 9 years, 2 months ago enjoyballonvaarten

    Hi Andrew,

    thanks for your reply.
    The URL is:
    http://www.enjoyballonvaarten.nl

  3. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Thanks, please, can you try editing the Layout Builder widget in the header. Try editing the row, click Layout and change the Row Layout from Full Width – Stretched to Standard.

  4. 9 years, 2 months ago enjoyballonvaarten

    Thank you very much for your help!

    I’ve tried this yesterday on my own, but not with the “standard” setting.
    This helps a lot!

    Now I have only one question to ask:
    How can I get the right column aligned downwards?
    So the social media and tel.nr will be aligned to the logo?

  5. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Can you perhaps try something else? Can you re-create the header widget area without the Layout Builder? Just insert the two widgets as they are now but directly into the Header widget area. It’ll be easier to assist from that position. Thanks :)

  6. 9 years, 2 months ago enjoyballonvaarten

    Done that :-)

  7. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Could you also remove the logo from the header widget area and insert it from AppearanceTheme SettingsLogo?

  8. 9 years, 2 months ago enjoyballonvaarten

    I’ve done that, but now I can’t see my logo in the header.

  9. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Would it be possible for you to create a temporary admin account for us so we can log in and take a look? You can create the account with the following email address:

    [email protected]

    Just navigate to UsersAdd New in your WordPress admin. Enter siteorigin for the username and [email protected] for the email address. Make sure you’ve selected Administrator for the role and enabled the Send Password field so we receive the details.

    Once we’re finished taking a look, you can delete this account. We’ll let you know when to do that.

  10. 9 years, 2 months ago enjoyballonvaarten

    Sorry the logo is too big now.
    Maybe I’ve to change the image on it self?

  11. 9 years, 2 months ago Private Message - WordPress

    This is a private message.

  12. 9 years, 2 months ago Private Message - Andrew Misplon Hi, I Work Here

    This is a private message.

  13. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Some aspect of the site’s Custom CSS is changing the way the header normally functions. I’ll do my best to assist.

  14. 9 years, 2 months ago enjoyballonvaarten

    What do I have to do now?

  15. 9 years, 2 months ago enjoyballonvaarten

    Okeej.
    Thanks!

  16. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Still working on it. Wasn’t Custom CSS. I’m nearly there.

    When I’m done you can adjust header padding from CustomizeTheme DesignGeneralHeader Padding. You can also adjust the logo image width size constraint from Custom CSS.

    I’ll let you know once I’ve fixed the header widget area.

  17. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    The basic issues should be fixed: http://www.enjoyballonvaarten.nl/. Sorry, I did go back to the Layout Builder. Can you let me know what final tweaks you want done?

  18. 9 years, 2 months ago enjoyballonvaarten

    Thank you very much!
    When I look on the website without a login than the logo is stretched vertical.
    But when I’m in the Customizer, it looks good.
    How is this possible?

    But apart from that, you helped me very well! Thank you for this!

    Maybe I ask for you help in the future :-)!

  19. 9 years, 2 months ago enjoyballonvaarten

    2016-05-23 17_19_37-www.enjoyballonvaarten.nl _ Passagiers- & Reclamevaarten

    Sorry that I’ve to ask again.
    But if you look on the print screen, you’ll see that the logo on the header is still stretched vertical.
    What can be the problem of this?

  20. 9 years, 2 months ago enjoyballonvaarten

    I only have this problem the browser window is maximized.
    When minimalized the logo is normal.

  21. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Thanks. Please, check again, you might need to refresh a few times.

    • 9 years, 2 months ago enjoyballonvaarten

      I’ve tried it, but I think there’s a higher min-height required.

      The only thing I regret is the quite large white area until the “min-height of 1000px” is reached at the moment there is no text.
      There must be a way the footer is automatically placed at the bottom of the screen you use?
      Regardless of the amount of text?

      Apologize for my bad english…

      Thanks.

  22. 9 years, 2 months ago enjoyballonvaarten

    Great!!
    Thank you!!!
    :-)

  23. 9 years, 2 months ago enjoyballonvaarten

    Hello, there I’m again :-).

    Sorry I have a question again…

    On the next link “http://www.enjoyballonvaarten.nl/prijzen/vipvaarten” you’ll see the the footer is too far upwards.
    This is not correctly aligned.
    It’s on every page, but I keep trying to avoid by adding additional text.
    How do I get the footer automatically in place?

    Thank you in advance :-)!

  24. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Try:

    #main {
        min-height: 1000px;
    }

    Adjust as required.

    • 9 years, 2 months ago enjoyballonvaarten

      enjoyballonvaarten
      I’ve tried it, but I think there’s a higher min-height required.

      The only thing I regret is the quite large white area until the “min-height of 1000px” is reached at the moment there is no text.
      There must be a way the footer is automatically placed at the bottom of the screen you use?
      Regardless of the amount of text?

      Apologize for my bad english…

      Thanks.

  25. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Unfortunately, Vantage doesn’t have a sticky footer. The sticky footer techniques I’ve seen in the past involved JavaScript, I don’t have a quick CSS solution for this challenge. As I’m sure you’re aware, you can adjust the min-height value as required, 1000px was just a suggestion.

  26. 9 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    For sure :)

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