Issued with Responsive (section 1)

[tarekkaram0]

Hi,

I am building a site with SKT Construction Pro, and I came to an unusual error. It seems that Section 1 of my homepage presets does not respond correctly to screen size changes; its not responsive.

While the remaining “sections” (Dashboard> appearance> Theme Options> sections) seems to be fine so far, section 1 fails to retain proper size. On tablet and on phone, there is extra space on the right. On desktop, if you decrease the window width, the section responds well initially, but then it snaps to a smaller size leaving empty space.

My site is called: samirsigns.com

Any idea what the issue might be?

PS: This problem did NOT exist on the free or “Lite” version of the site.

[Sonnal S Sinha]

Hi,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

@media screen and (max-width:767px) {
.panel-grid.panel-no-style, .panel-grid.panel-has-style .panel-row-style { display:block !important;}
#footer-wrapper iframe { width:100%; box-sizing:border-box;}
}

Regards,
Chris

[tarekkaram0]

Hi Chris,

Thank you for the code, I followed the instructions and it seems to work. On mobile, the size looks good. On desktop PC full screen, the size looks good also. However, error I describe before is still there. Sizes between the short width of a phone, or the wide width of a PC still have the same error. To demonstrate the error, if you take the browser page and slowly decrease the width. You will see that section 1 breaks and looks ugly, until the window gets very small and then it snaps back and looks better.

I posted screen shots here: https://www.dropbox.com/s/ivp6ppjsi2vb9bw/website%20responsive%20error.docx?dl=0

Can you recommend anything please.

Thank You

[Sonnal S Sinha]

Hi,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

#wrapOne .panel-grid.panel-no-style, .panel-grid.panel-has-style .panel-row-style { display:inline-block;}
#wrapOne #pgc-2-0-0, #wrapOne #pgc-2-0-1 { float:left;}

Regards,
Chris

[tarekkaram0]

Wonderful!

Thank you Chris, the website seems to function appropriately now. I appreciate the help, and I recommend this code be added to the raw file for the theme so the next customer will not experience the same problem.

Thank you again!

[Sonnal S Sinha]

Hi,

If you found our service good kindly review us here: https://www.sktthemes.org/forums/topic/reviews-and-testimonials/page/8/

Regards,
Chris

[Author]

Posts