Custom Community Nav Menu Bar height doesn't adjust (increase) in mobile view

[jopaislies]

Hi,
I am working on 2 blogs using the Custom Community Theme.
Thefirst blog: https://blog.lilangelpetboutique.com when viewing in mobile view you will see the height of the Nav Menu Bar does not increase in height like it should.

If you look at the 2nd blog: https://blog.paisleysartstudio.com
you will see the difference.

I want the Nav Menu bar of the first blog to look like the second blog.

Any advice will be greatly appreciated.
Jo

[chicdesigngeek]

It looks like this css code is making the green background disappear:

div#access {
background-color: transparent;
}

Once you remove that, it’s able to keep the green background when in mobile view. Hope this helps!

[konradS]

hi jopaislies and chicdesigngeek,

never change theme files directly, as all changes would be lost with every theme update..

rather add some CSS to your THEME SETTINGS -> CSS tab,
which is the update-safe overwrite section for CSS changes.

Add something like this:

#header div#access {
background-color: green;
}

should overwrite as it is stronger anyway..
modify the green color with your exact color for example in hex code..

hope this helps,
konrad

[konradS]

i have no clue how you made this but it looks not correct on my normal laptop device.

the content and slider are far out to the right..

did you change any theme files or added custom CSS already?

[jopaislies]

KonradS,
I have not changed any theme files at all. Here is the only CSS I added to the CSS tab under the Theme Options:

#outerrim {
width: 1000px;
margin: 0 auto;
}
.blog div.pagination, div.v_line {
background-color: transparent;
border: none !important;
border-color: transparent;
}

#footer .widgetarea h3.widgettitle {
background-color: transparent !important;
font-size: 17px;
font-color: #333;
}

This is all that is in there.
Thefirst blog: https://blog.lilangelpetboutique.com has looked like that for a while.
The 2nd blog: https://paisleysartstudio.com I just set up recently. And slider looks the same (far out to the right.)

Not sure why it is like that. I don’t like it that way. Any suggestions?
Thanks,
Jo

[konradS]

hi jo,

i got the thing that maks it look so weird:

remove the first style from your custom css, this one here:

#outerrim {
width: 1000px;
margin: 0 auto;
}

its wrong -> remove it..

should look okay directly then..

please let me know, konrad

[jopaislies]

KonradS,
Thanks! I removed it from both blogs but, I am not sure if it did anything. Please take a look and let me know if it looks different on your end.

https://blog.lilangelpetboutique.com

https://www.paisleysartstudio.com

I greatly appreciate it.
Thanks,
Jo

[konradS]

hi jopaislies – yeah looks better now!

at least the weird moved container is gone, yes!

sorry for the late reply! ≈konrad