Coach Press Mobile Site…

[fredrick]

The mobile site is a mess for this theme. The top bar social icons are not aligned left and right, the menu hides half the page because it is behind it, the page titles are also under the menu.

My site is simplysellrealty.com where you can see it.

Please help!

[fredrick]

Also at some screen sizes there is a glimpse of the page title color to the far left and right of the menu.

[Sonal S Sinha]

Hi,

1. The mobile site is a mess for this theme. The top bar social icons are not aligned left and right, the menu hides half the page because it is behind it, the page titles are also under the menu???

Ans: Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media screen and (max-width:479px) {
.header.type3 .logo, .header.type4 .logo { width:75%;}
.header.type3 #simple-menu { margin-top: 20px;}
.home #content { margin-top:0;}
.head-info-area .left, .head-info-area .right { float: left; width: 50%;}
}

2. Also at some screen sizes there is a glimpse of the page title color to the far left and right of the menu??

Ans: Can you send us the screenshot of your issues? Upload your screenshot on https://imgbb.com/ and paste the share url here.

Regards,
Dave

[fredrick]

Hi, I added the CSS and it still is off centered (see below). I think the issue with the title is that I do not have it hidden but it is not showing.

https://ibb.co/VMcLGwz
https://ibb.co/CQp5czp

[Sonal S Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media screen and (min-width:768px) and (max-width:1023px) {
.head-info-area .left {
  text-align: left !important;
}
}
.mywrap { position:relative;}
.header_layout3 {
  width: 1200px;
  margin: 0 auto;
}
.page_head, .post_head, .services_head { height:170px;}

Regards,
Dave

[fredrick]

That works for most screen sizes, please see below. Please test by reducing the screen all the way. It seems that other sizes it is still messing up.

https://ibb.co/C1RGChs

[fredrick]

Also, the top bar is messing on that same pic.

[Sonal S Sinha]

Hi,

Kindly use this CSS.

@media screen and (min-width:1024px) and (max-width:1160px) {
.header_layout3 {
  width: 95%;
  margin: 0 auto;
}
.page_head, .post_head, .services_head {
  height: 170px !important;
  width: 100%;
  margin: 0 auto;
}
.head-info-area .right { padding-top:10px; float: right !important; width: 26% !important;}
}

Regards,
Dave

[fredrick]

Now the page doesn’t shrink well, it will scroll right due to a wide title bar.

[Sonal S Sinha]

Hi,

Kindly use this CSS code.

@media screen and (min-width:320px) and (max-width:1023px) {
.header_layout3 {
  width: 100%;
  margin: 0 auto;
}
}

Regards,
Dave

[fredrick]

The title is still hidden on a certain width (see below). Thank you for being so responsive and fixing this!

https://ibb.co/414vjB8

[Sonal S Sinha]

Hi,

Kindly send us your URL of the site and WordPress admin details (Username & Password) via email:[email protected] Please mention this forum URL while replying so that we understand what needs to be done.

We’ll check and revert back to you.

Regards,
Dave

[fredrick]

Hi, you have my URL and I can’t provide access to the admin. It’s doing the same thing that you provided a solution for above but just at another screen size. Can you please test my contact page by making it narrow and you will see that the title is being a Hidden at some point again.

[fredrick]

How can I just hide the title on mobile and not have the front page hero hide behind the menu??

[Sonal S Sinha]

Hi,

Kindly use this CSS.

@media screen and (max-width:479px) {
.header_layout3 {
  display: none !important;
}
}

Regards,
Dave

[Author]

Posts