Questions for mobile version

Hi

I am working on a website and when I check my website on my iphone, I find some problems on my sites.

  1. There is a big space between the header and content. Is there any way to remove it?
    http://cldup.com/M66MEkEUe1.jpg

  2. The footer is too big, can I make it small?
    http://cldup.com/-4vQB9qYJX.jpg

  3. In about page, my text is cropped. How can I make it uncrop?
    http://cldup.com/9VFmNZsky7.jpg

4.I got this banner on my every page but I think the mobile version resize it so it
is not showing right. It suppose be full width.

  1. Mty contact page is cropped as well.
    http://cldup.com/7HaUURGFtl.jpg

  2. I find that every has this space on both side but all column should be full width.
    http://cldup.com/qKCJcKktdo.jpg

That’s all my problem so far and here is my link
http://initi.com.tw/

Thanks

Hello there,

Thank you for reporting. Let’s address them one by one.

Try to apply the following CSS code:

> 1

#pg-19-0 .panel-row-style{
  padding: 0 !important;
}

> 2

@media only screen and (max-width: 991px){
  
  .footer-widgets{
    padding: 0;
  } 
  
  .footer-widgets .widget {
    margin-bottom: 0;
  } 

}

> 3

Apologies, it required more deeper inspection in the JS code. I cant provide an immediate fix. Please be patient.

> 4

@media only screen and (max-width: 780px){
  
  #pg-134-0 .panel-grid-cell {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }  
  
}  

> 5

@media only screen and (max-width: 767px){
 
  #pg-134-1 .panel-grid-cell{
   margin-left: 15px;
   margin-right: 15px;
  }    
  
}  

> 6

Apologies I can’t find its URL. Could you please share it here?

Regards,
Kharis

Hi Kharis

Thanks for help. Those code are really helpful but now I got a new problem. I got white space on the side, is there any way to remove it?

For Q6, sorry I do not have any idea how to post a image here. Could you try the link again?

Cloudup

And last for Q3, I am fine to wait, please take your time.

Thanks

Hello there,

> … I got white space on the side, is there any way to remove it?

Try to apply the following CSS code:

html,
body{
  overflow-x: hidden;
}

> Q6

Try to apply the following:

@media only screen and (max-width: 780px){
  .page-id-273 .panel-grid-cell {
   padding-left: 0 !important;
   padding-right: 0 !important;
  } 
}

> And last for Q3, I am fine to wait, please take your time.

Thank you for your patience.

Regards,
Kharis