Problem/Motivation

Table headers are vertically-aligned at the bottom of their cell, which is correct for column headers but awkward-looking for row headers.

Example: Brief overview, and history of automated upgrading to Drupal 8 (scroll to the "How to find the migration modules and tools" table)

  • "Name", "Where is it?" and "What does it do?", at the top of columns, are correctly bottom-aligned.
  • "Migrate", "Migrate Drupal", "Migrate Drupal UI"…, at the left of rows, are incorrectly bottom-aligned. They should be top-aligned.

Proposed resolution

Add a new SASS rule to target <th> elements inside rows after the first one:

sass/partials/common/_table.scss :
tr {
[…]
  &:nth-of-type(n+2) th {
    vertical-align: top;
    }
}

Remaining tasks

  • Testing

User interface changes

None

API changes

None

Data model changes

None

Original report by [username]

N/A

CommentFileSizeAuthor
#2 patch.diff668 bytesUTAN_dev
d.o - row th top vs bottom.png69.98 KBUTAN_dev

Comments

UTAN_dev created an issue. See original summary.

UTAN_dev’s picture

Issue summary: View changes
StatusFileSize
new668 bytes
drumm’s picture

Assigned: Unassigned » drumm

Drupal is generally good at using <thead> tags for headers, and I see getting that added in CKEditor isn’t too bad. So we can target thead th rather than nth-of-type hacks.

  • drumm committed bcc93d8 on 7.x-2.x, dev authored by UTAN_dev
    Issue #2859260 by UTAN_dev, drumm: Table headers on table body rows...
drumm’s picture

Status: Active » Fixed
Issue tags: +needs drupal.org deployment

This will be deployed later this afternoon.

drumm’s picture

Issue tags: -needs drupal.org deployment

This has been deployed.

UTAN_dev’s picture

Targeting <thead> makes total sense. Good call.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.