[Resolved] center logo above site title

[Ron]

have tried different css this code comes the closest to what I want except not centering logo over site title it is sitting above on the left
thanks for your help

.site-branding-container {
    flex-direction: column;
}

.site-logo, .site-branding {
    width: 100%;
}

.site-branding {
    text-align: center;
}

.site-logo {
    margin: 0 !important;
}

.mobile-header-navigation {
  padding: 10px;
}

.column-shadow {
	box-shadow: 0px 0px 16px rgba(200,200,200,0.2);
}

.rounded-corners img {
border-radius: 12px;
box-shadow: 0px 0px 16px rgba(200,200,200,0.2);
}

 /* End GeneratePress Site CSS */

[Ying]

Hi Ron,

Any chance you can link us to the site in question?

You can use the private information field.
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Let me know 🙂

[Ron]

ok pasted link in private info area

[Ying]

Try follow the steps below:

1. Remove the CSS for header/navigation area.

2. Go to customizer > layout > primary navigation, set the navigation locationto below header.

3. Go to customizer > layout > Header, set Header Alignment to center.

4. Add this CSS:

.site-branding-container {
    display: flex;
    flex-direction: column;
}

Let me know if that works.

[Ron]

thank you
you folks at Generatepress are the best

[Ying]

You are welcome 🙂

[Manuel]

Thank you Ying for this code to centering logo on mobil header:
.site-branding-container {
display: flex;
flex-direction: column;
}
Is working perfectly!

[Ying]

Hi Manuel,

Glad to hear that 🙂

[Author]

Posts