- This topic has 15 replies, 3 voices, and was last updated 1 year ago by
David.
-
AuthorPosts
-
December 28, 2019 at 6:41 pm #1116461
jorge
Used this guide and was able to get button working, but isn’t centered – it is off to the right on my phone, was wondering if there’s css, or any setting to have it centered no matter the device.
Thank you very much!
December 29, 2019 at 8:41 am #1116849jorge
Any ideas? Thanks again, just bumping.
December 29, 2019 at 9:08 am #1116854Tom
Lead DeveloperLead DeveloperHi there,
Try this CSS:
#mobile-header .mobile-bar-items { position: absolute; left: 50%; transform: translateX(-50%); text-align: center; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 29, 2019 at 9:13 am #1116859jorge
That did it. Thank you very much, Tom!
December 29, 2019 at 9:19 am #1116868Tom
Lead DeveloperLead DeveloperYou’re very welcome 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 29, 2019 at 9:21 am #1116869jorge
Tom, it seems like the button text protrudes outside of the bar as in a small box. also when i scroll up , etc the placement of the button moves which looks odd.
December 29, 2019 at 9:21 am #1116870jorge
I mean the button itself is outside of the bar as you scroll down.
December 29, 2019 at 9:23 am #1116871Tom
Lead DeveloperLead DeveloperTry adding this as well:
#mobile-header .mobile-bar-items .button { padding-top: 0; padding-bottom: 0; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 29, 2019 at 9:26 am #1116872jorge
Okay That removed the protrusion of the button. The button is not fixed as you scroll up it moves from one side to the other.
December 29, 2019 at 11:58 am #1116940jorge
Is there anything i can do about the button moving as you scroll up and down? it doesn’t stay in a fixed spot.
December 29, 2019 at 7:55 pm #1117117Tom
Lead DeveloperLead DeveloperCan you try the updated CSS?: https://generatepress.com/forums/topic/want-button-inside-mobile-header-centered/#post-1116854
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 29, 2019 at 8:12 pm #1117131jorge
I did try that, what i’m saying is as i scroll up, and down – the button shifts position as i scroll up or down it does not stay in a fixe position.
December 29, 2019 at 8:13 pm #1117133jorge
Does not stay in a fixed position.
December 30, 2019 at 5:29 am #1117350David
StaffCustomer SupportHi there,
remove this:
#mobile-header .mobile-bar-items { position: absolute; left: 50%; transform: translateX(-50%); }
and lets try this instead:
#mobile-header .mobile-bar-items { margin-left: auto; margin-right: auto; } #mobile-header .menu-toggle { min-width: 60px; } .site-logo.mobile-header-logo { margin-right: unset; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/December 30, 2019 at 5:53 am #1117359jorge
That worked great, thank you!
-
AuthorPosts
- You must be logged in to reply to this topic.