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.

Header widget: no margin in mobile view [vantage premium]

9 years ago · Last reply by Alex S 9 years ago

Hey guys,

theme: vantage premium

site: vonsternberg.eu

problem: on small screens there is no space between the brown button in the header (“Sprechzeiten”) and the social media buttons. Also, on a mid-sized (720p?) screen, both widgets are under each other but only “Sprechzeiten” is centered, the social media widget is aligned to the left.

I tried solving this in css but i cant figure out any real solution.

haaalp

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

Need fast email support? Get SiteOrigin Premium

Replies

1
  1. Alex S Staff 9 years, 10 months ago

    Hi Friedrich,

    You can change this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

    /* Ensure social icons in header are centered for mobile devices */
    .vc_responsive .widget_vantage-social-media .widget_vantage-social-media {
    	text-align: center;
    }
    .vc_responsive .widget_vantage-social-media .social-media-icon {
    	float: none;
    	display: inline-block;
    }
    /* Improve header widgets spacing for mobile devices */
    .vc_responsive .site-header .widget {
    	margin-top: 5px !important;
    }

    You need to adjust the margins between the boxes to get your desired spacing. You might also need to install the SiteOrigin CSS Editor.

    By the way, as you’re a Vantage Premium user, you’re entitled to priority email support. If you would like to make use of that, please follow the instructions found on this page. Please reference this thread.

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