Social media sharing pills misaligned in sidebar

[grvsachdeva]

Please describe the problem (or idea)

What did you expect to see that you didn't?

Social media sharing pills not aligned in the sidebar.

(Issue observed in #5005)

Please show us where to look

Observed in various pages. Example: https://publiclab.org/wiki/name-your-project-here

---

Thank you!

Your help makes Public Lab better! We deeply appreciate your helping refine and improve this site.

To learn how to write really great issues, which increases the chances they'll be resolved, see:

https://publiclab.org/wiki/developers#Contributing+for+non-coders

[avats-dev]

@gauravano I don't know how but social pills alignment in https://publiclab.org/wiki/name-your-project-here works fine for me, as you can see in this gif.

Maybe this is platform dependent, but I'm not sure. FYI I'm using Mozilla Firefox x64 (80.0.1) on Ubuntu (20.04 LTS).

[grvsachdeva]

Hmm, it seems to be browser-related. I am getting correct alignment in Safari as well but in Chrome it's misaligned. I am also wondering if we can fit all the 3 pills in a single row? Currently, it's coming in 2 rows irrespective of screen size.

Thank you @avats-dev for checking it for Firefox and highlighting on browser-specific point :)

[ebarry]

This is tricky! I just went to the wiki page you linked to in Chrome, and i am not seeing the mis-alignment. Here's what i see at all screenwidths:

[avats-dev]

😕
@gauravano yeah, keeping all three in a single row might be good or keeping only one in a row 🤔

[cesswairimu]

Yeah looks fine on my end too

[grvsachdeva]

That's weird. Let's ignore the alignment issue then. Maybe something wrong with my browser :P. @avats-dev if you want you can place all 3 buttons in a single row. I think, separate row for each button would not look good and take more space too. What do you think @ebarry @cesswairimu?

[theBstar]

I can see the issue occurring on Chrome 85. I can raise the fix for this. Can you please assign the issue to me?

[avats-dev]

@theBstar you're good to go. 👍 Can you also shift them all in a single row and check if it better than this? Thanks.

[cesswairimu]

Yeah I agree @gauravano if they could fit on a single row that would be super. @theBstar I have assigned you the issue. Thanks

[ebarry]

Can someone check if this changes based on if they are viewing the website in another language? I now see that i'm experiencing the same bug that Gaurav highlighted in my browser that is set to a different language. @jywarren — i think this is maybe related to the other translation stuff.

[cesswairimu]

oh yeah, I can see it when I change the language