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, 1 month 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, 1 month ago enjoyballonvaarten

    Hi Andrew,

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

  3. 9 years, 1 month 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, 1 month 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, 1 month 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, 1 month ago enjoyballonvaarten

    Done that :-)

  7. 9 years, 1 month 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, 1 month ago enjoyballonvaarten

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

  9. 9 years, 1 month 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, 1 month ago enjoyballonvaarten

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

  11. 9 years, 1 month ago Private Message - WordPress

    This is a private message.

  12. 9 years, 1 month ago Private Message - Andrew Misplon Hi, I Work Here

    This is a private message.

  13. 9 years, 1 month 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, 1 month ago enjoyballonvaarten

    What do I have to do now?

  15. 9 years, 1 month ago enjoyballonvaarten

    Okeej.
    Thanks!

  16. 9 years, 1 month 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, 1 month 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, 1 month 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, 1 month 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, 1 month ago enjoyballonvaarten

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

  21. 9 years, 1 month ago Andrew Misplon
    Hi, I Work Here

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

    • 9 years, 1 month 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, 1 month ago enjoyballonvaarten

    Great!!
    Thank you!!!
    :-)

  23. 9 years, 1 month 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, 1 month ago Andrew Misplon
    Hi, I Work Here

    Try:

    #main {
        min-height: 1000px;
    }

    Adjust as required.

    • 9 years, 1 month 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, 1 month 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, 1 month 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