Automattic / jetpack

Security, performance, marketing, and design tools — Jetpack is made by WordPress experts to make WP sites safer and faster, and help you grow your traffic.
https://jetpack.com/
Other
1.58k stars 799 forks source link

Sharing: Pinterest counter display overlap #12343

Open formosattic opened 5 years ago

formosattic commented 5 years ago

Issue initially spotted on WordPress.com, but reproduced on a self-hosted WordPress.org site and with two different themes (Dyad, Twenty Nineteen).

Steps to reproduce the issue

  1. Add Sharing buttons
  2. Make sure Official Buttons style is selected
  3. Share a post to Pinterest

What happened

The Pinterest bubble counter overlaps with the next button:

Screen Shot 2019-05-12 at 16 40 09

What I expected

That the Pinterest counter shows nicely with other buttons.

In p9cu9o-1Fn-p2, the below CSS fix was offered, and makes the display consistent with the Facebook button:

Screen Shot 2019-05-12 at 16 45 30
.pinterest_button a span {
  position: static !important;
  float: right;
  width: auto !important;
  background: transparent !important;
  padding: 0 5px 0 10px;
  color: #fff !important;
}

.pinterest_button a span::before {
  display: none;
}
jeherve commented 1 year ago

Similar issues can happen with the Pocket button:

image