WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

#29963 closed defect (bug) (fixed)

Twenty Fifteen: Bottom border on `a` elements looks odd when the link content is an image

Reported by: jblz Owned by: iandstewart
Milestone: 4.1 Priority: normal
Severity: normal Version: 4.1
Component: Bundled Theme Keywords: has-patch
Focuses: ui Cc:

Description

It's particularly unnerving when the image has transparency because you can see the border line through the middle of the image.

Attachments (4)

29963-with.png (36.5 KB) - added by jblz 6 years ago.
How it looks with the rule applied
29963-without.png (36.5 KB) - added by jblz 6 years ago.
How it looks without the rule applied
29963.diff (310 bytes) - added by iamtakashi 6 years ago.
29963.1.diff (573 bytes) - added by iamtakashi 6 years ago.
Narrow down the scope of removing border from linked images.

Download all attachments as: .zip

Change History (15)

@jblz
6 years ago

How it looks with the rule applied

@jblz
6 years ago

How it looks without the rule applied

#2 @obenland
6 years ago

  • Component changed from Themes to Bundled Theme

#3 @rachelbaker
6 years ago

While border-bottom allows for fancier styles accounting for the different types of content (videos, iframes, images, etc) that can be wrapped in an anchor element it looks like text-decoration: underline is the only cross-browser supported non-jQuery solution here.

This ticket was mentioned in IRC in #wordpress-dev by rachelbaker. View the logs.


6 years ago

@iamtakashi
6 years ago

#5 @iamtakashi
6 years ago

Will the patch above cause any issue?

Last edited 6 years ago by iamtakashi (previous) (diff)

#6 @iandstewart
6 years ago

  • Keywords has-patch added
  • Milestone changed from Awaiting Review to 4.1

#7 @iandstewart
6 years ago

Patch works for me.

#8 @iandstewart
6 years ago

  • Owner set to iandstewart
  • Resolution set to fixed
  • Status changed from new to closed

In 29927:

Twenty Fifteen: make sure we don't see borders through transparent linked images.

Props iamtakashi, fixes #29963.

#9 @jblz
6 years ago

Thanks, all.

#10 @iamtakashi
6 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

I was testing with some third party widgets and I've seen some issues because of 29963.diff.

https://cldup.com/hT6nrbNDoL.png

The sicons should be next to each other.

We should narrow down the scope of 29963.diff to just the main content where we add borders to links.

@iamtakashi
6 years ago

Narrow down the scope of removing border from linked images.

#11 @iandstewart
6 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

Fixed with r30269.

Note: See TracTickets for help on using tickets.