Mobile settings for margins not registering

[comedowntous]

Hello - I am trying to customize margins for mobile browser. However none of my settings are registering - for example editing the Main Menu Top Frame % to 20% in the customizer returns no results - the menu floats to the top of the page as if margin top was set to 0. The only wait it moves further down the page is if the menu bar is revealed.

Furthermore - editing the mobile browser margins for pages + categories does not return any results either. I've edited the gridder defaults for both desktop + mobile versions + edited each page's mobile version margins to no result.

Is anyone else having this issue with mobile settings not registering?

Thanks!

[mariusjopen]

Dear @comedowntous
Can you post a link to our website?
Then we can have a look and inspect that.

Marius

[comedowntous]

Thanks! — agentandartist.co

I have also tried to center text in the /artists page to no success. I gave the link a class and tried to apply custom css - after inspecting it with developer tools I verified the browser was able to register this however there were no changes in position.

Is there a way to override this with !important!?

[comedowntous]

Example - the /artists page:

There is a link here which I would like centered across different media sizes -

In the gridder

<p class="_Default" style="text-align: center;"><a class="artist-link" href="/linkname"><span style="color: #000000;">LINK NAME</span></a></p>

Cudtom CSS

.artist-link:link {
    width: 60%;
    left: 20%;
    position: absolute;
    text-align: center;
    top: 0;
}

[mariusjopen]

Dear @comedowntous
the page appears blank here.

Try this instead:

.artist-link {
    width: 60%;
    left: 20%;
    position: absolute;
    text-align: center;
    top: 0;
}

Best!

Marius

[comedowntous]

Thanks - The site is back up now, I'm still having trouble with the menu on mobile. None of my position settings seems to be registering and the menu links are fixed to the top of the page above the site title.

[mariusjopen]

Dear @comedowntous
you can use CUSTOM CSS:

.laynav.mobile-nav {
    margin-top: 20px;
}

That should do the job!

Best!

Marius

[comedowntous]

@mariusjopen said in Mobile settings for margins not registering:

.laynav.mobile-nav {
margin-top: 20px;
}

Thank you! - this works at placing the menu at a fixed position on mobile. However when the phone is switched to landscape format the menu then overlaps with the sitetitle, any way to work around this?

Also any way I can center the #grid across all pages - the page content div on mobile is not centered/fixed and so it floats to overlapp with navigation at the top of the page.

Thanks again!

[mariusjopen]

Dear @comedowntous
have a look into media-queries for CSS.

There you can play around with the browser size for CSS.

Best!

Marius