- This topic has 12 replies, 3 voices, and was last updated 1 year, 6 months ago by
David.
-
AuthorPosts
-
August 19, 2019 at 3:58 am #987706
dasigna
strange phenomenon when viewing website in mobile view – the mobile menu icon has a red line above …
no clue where this is coming from. even the red color is not used anywhere. the css gives no hint at all.
completely running out of ideas.maybe this has happened somewhere before??
August 19, 2019 at 5:39 am #987777David
StaffCustomer SupportHi there,
it is the background image that has been added to the navigation and toggle with this CSS:
.main-navigation, .menu-toggle { background-image: url('https://b95qpec.myraidbox.de/wp-content/uploads/2019/08/lackierzentrum-vs-farbspektrum.png'); background-repeat: no-repeat; }
If you target just the
.main-navigation
then it should fix the issue.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 19, 2019 at 6:07 am #987797dasigna
hi david,
this is kind of funny π
you are somewhat pointing into the obviously right direction, but not exactly nailing it.
this css is not a part of custom css! the bg image is applied via customizer and the css you are pointing at is inline css from gp… ??so one way to solve this would be:
apply the bg image completely via custom css – which works.
but then unfortunately the misaligning of the two icons (search and hambuger) persists…
(this is the status at the moment)so what has to be done to keep the image within customizer without gp applying it to
.menu-toggle
??
and keep the icons aligned?menu tweaks are always kinda hard thing to do in gp … at least for me π
thanks for efforts again.
August 19, 2019 at 6:26 am #987804David
StaffCustomer SupportCan you flush and disable your cache so i can see what is effecting the alignment, the background image should not affect this.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 19, 2019 at 6:42 am #987819dasigna
theres no caching going on currently.
August 19, 2019 at 6:49 am #987827dasigna
… i’m on track (?):
the misalignment might have to to with the resizing of the logo, but not getting behind it now as it appears only on mobile not on desktop …remaining question:
why does gp apply the.menu-toggle
class when adding a background image to main navigation???August 19, 2019 at 6:54 am #987829David
StaffCustomer SupportSo as the background applies to the default navigation menu on mobile
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 19, 2019 at 7:14 am #987843dasigna
So as the background applies to the default navigation menu on mobile
sorry, cant follow π
anyway – the search-icon is still not aligning vertically (non-sticky only)
any way to solve this?August 19, 2019 at 10:13 am #988147David
StaffCustomer SupportIf you have a standard site header and navigation (ie. not the Navigation as header then on Mobile the Primary Navigation sits below the header. The
.menu-toggle
is required so as the navigation on mobile also gets the background.It may be something we’ll take a look at for when using Navigation as Header but it hasn’t come up as an issue before.
Try this CSS to align the icons:
@media (max-width: 960px) { .main-navigation:not(.slideout-navigation) .inside-navigation { align-items: center; } }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 19, 2019 at 10:40 am #988164dasigna
unfortunately your code didnt work.
… did’nt i mention i’m using the navigation as header?? sorry if i should have done – in fact thats the case π
August 19, 2019 at 11:39 pm #988524Tom
Lead DeveloperLead DeveloperIt looks good on my end with that CSS – maybe your browser has it cached?
Let us know π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentAugust 20, 2019 at 11:20 am #989122dasigna
hi guys,
hmmm – thats VERY strange! tried back and forth yesterday with that code and other – nothing worked… today i have to admit that it does. perfectly.
no caching was going on, as i’m testing such sniplets mostly direct in browser at first and then simply left it within custom css to keep it… i think i have to test out what went wrong that jangles my nerves from time to time!so this seems to be resolved.
again learned something new about navigation, working well, great and patient support as always πthanks guys.
August 21, 2019 at 3:08 am #989486David
StaffCustomer SupportGlad we could be of help
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.