Docs

[Phobbsiii]

While developing my website, suddenly the mobile menu does not display inline with my text logo. Cornerstone displays it properly, however when loading from my phone it displays incorrectly.

I noticed it after adding this CSS

.p-meta span:nth-child(1), .p-meta span:nth-child(3) {
display: none !important;
}

.blog .x-header-landmark {
display: none;
}

.blog .x-container.max.width.offset {
max-width: 750px;
}

[Friech]

Hi There,

Thanks for writing in! That is because the logo (SocialNetMe) and the Navbar does not fit on small screen.

You can add this under Custom > CSS in the Customizer to address this issue.

@media (max-width:  400px) {
	a.x-brand.text {
	    font-size: 32px;
	}
}

Cheers!

[Phobbsiii]

Thank you so much! I figured it was something simple like this, I just wasn’t sure how to target that specific element.

[Thai]

If you need anything else please let us know.

[Phobbsiii]

I actually have one more question. I am currently using

.blog .x-container.max.width.offset {
max-width: 750px;
}

To shrink the width of my blog. How can I make it so that the inline logo/navbar is also at that max width? Also, how can I set it so that when you are on the blog page, the URL the logo directs you to is the blog rather than back to the home page.

[Thai]

Hi There,

Please add the following CSS:

.blog .x-navbar .x-container.max.width,
.blog .x-container.max.width.offset {
    max-width: 750px;
}

Also, how can I set it so that when you are on the blog page, the URL the logo directs you to is the blog rather than back to the home page.

Please add the following code under Customizer > Custom > Global Javascript:

jQuery(".single-post .x-brand").attr("href", "http://your-blog-url.com/blog");

Hope it helps 🙂

[Phobbsiii]

Perfect! Thank you so much!

[Rue Nel]

You’re welcome!
Thanks for letting us know that it has worked for you.

[Author]

Posts