Monitor Reply

Support

Social Media links in header not working on small screens and mobiles

Permalink Browser Info Environment June 25, 2017 at 9:15 PM

Hi, the social media links in the header do not work when the responsive rules kick in so on any mobile device or even on my browser when I shrink the window... can you help with this please.

Thanks.

Type:	Pre-Sale
Status:	In Progress

c5box replied on Jun 26, 2017 at 11:17 pm Permalink Reply

Hi

Thanks for letting me know. I have fixed this on version 1.1.3. :)

Thanks and regards,
James

CharismaBusiness replied on Jun 28, 2017 at 2:20 pm Permalink Reply

OK, I just updated my sites to the most recent version and I am still having the problem...http://wilsonhomelending.com/ andhttp://CanadianIn.com

c5box replied on Jun 29, 2017 at 1:00 am Permalink Reply

Hi!

Can you try clearing the C5 cache on the dashboard. Also clear your browsers cache after. I have applied the fix to the live site and it's currently working. Let me know if it is still not working so I can check further.

Kind regards,
James

CharismaBusiness replied on Jun 29, 2017 at 3:49 pm Permalink Reply

I did do that... The both the site cache and browser cache is cleared. I'm still seeing the problem. I was looking in the code, I didn't see any changes either. Maybe the update didn't take properly.

If you want, you can just tell me what file needs to be updated and provide me with the updated code I can manually add it.

c5box replied on Jun 30, 2017 at 12:01 am Permalink Reply

Hi,

That's strange. I took at your site's source code and the new updates didn't take place.

Anyway, the new code can be found in the layout.less located in packages/c5box_genesis/themes/genesis/css/build/layout.less

on line 43 #socialicons add/replace this code

#socialicons{
                        order:2;
                        margin-right: 90px;
                        position: relative;
                        z-index: 5;
                        .ccm-block-social-links{
                            text-align: right;
                            white-space: nowrap;
                        }
                    }

Please let me know if you need further assistance.

REgards,
James

c5box replied on Jun 30, 2017 at 12:14 am Permalink Reply

Old code:

#socialicons{
                        order:2;
                        padding-right: 90px;
                        .ccm-block-social-links{
                            text-align: right;
                            white-space: nowrap;
                        }
                    }

New code:

#socialicons{
                        order:2;
                        margin-right: 90px;
                        position: relative;
                        z-index: 5;
                        .ccm-block-social-links{
                            text-align: right;
                            white-space: nowrap;
                        }
                    }

CharismaBusiness replied on Jun 30, 2017 at 1:52 am Permalink Reply

Perfect, yeah, I was able to manually go in and change the CSS and it worked. Thanks!

asebele replied on Sep 28, 2017 at 5:25 pm Permalink Reply

I myself just realized this is not working too on the mobile site.

asebele replied on Sep 28, 2017 at 5:31 pm Permalink Reply

Just saw the code replacement. Thank you that worked.

Genesis

Support

Social Media links in header not working on small screens and mobiles

Issue Reply

concrete5 Environment Information

Browser User-Agent String

Hide Post Content

Request Refund

Code

Delete Post