Code breaks responsiveness/mobile site

cytropics

Hi,
Code breaks responsiveness on website. Please check code added in custom.css file to handle the trend-tag position module.
.ja-search .trend-article .moduletable .video-player div{float:left;margin-right:20px;}
.ja-search .trend-article .moduletable .video-player {margin: 0 auto;padding: 0 19em;overflow: hidden;}

Thanks in advance.

pavit

Hi cytropics

Ja cityguide in default installation doesn't add any custom.css file , if you are having issues with custom code then remove it.

Regards

cytropics

pavit your moderator added it to resolve an issue. It is now affecting responsiveness of the site.

pavit

Hi cytropics

Could you describe in detail the problem you are seeing ? and on which page specifically ?

cytropics

pavit On homepage. Please check here: city guide --> custom.css look for the following code:
.ja-search .trend-article .moduletable .video-player div{float:left;margin-right:20px;}
.ja-search .trend-article .moduletable .video-player {margin: 0 auto;padding: 0 19em;overflow: hidden;}

In mobile view, this code breaks the responsiveness. I commented it out for now.

Please see screenshots

Thanks in advance.

pavit

Hi cytropics

I looked at your website with my iPhoneX and cannot replicate the issue showed in your screenshot

cytropics

pavit please read that I commented it out for now. If you want to test it, please uncomment code in custom.css file temporarily.

cytropics

pavit Google penalizes terribly for mobile sites. To replicate, Please work quickly or leave it uncommented.

Thank you.

aman204

cytropics Kindly check now. Have added this further to custom.css file to have the elements positioning right for responsive mode (can adjust the max-width accordingly):

@media only screen and (max-width: 768px){.ja-search .trend-article .moduletable .video-player {display: inline;}}

Have commented out the specific CSS (line 91-93) which you can uncomment after testing and verifying the same

cytropics

works. Thank you.