WordPress.org

Making WordPress.org

Opened 4 months ago

Last modified 13 days ago

#4491 new defect

Archive page shows 2 columns instead of 3 at certain media queries

Reported by: milana_cap Owned by:
Milestone: Priority: normal
Component: HelpHub Keywords: has-screenshots has-patch needs-design
Cc:

Description

CSS used for these columns should be changed to something more reliable and up to date. This is what we have now:

@media (min-width: 48em)
.three-up .archive-block, .three-up > div {
    display: inline-block;
    vertical-align: top;
    width: 30%;
    margin-right: 4.5%;
    font-size: 0.8rem;
}

.three-up .archive-block:nth-child(3n), .three-up > div:nth-child(3n) {
    margin-right: 0;
}

Using either Flexbox or CSS Grid would make columns behave better.

One of effected pages: https://wordpress.org/support/category/getting-started/

Screenshot:

https://user-images.githubusercontent.com/7957680/41554497-a217d596-72fa-11e8-9c20-2500a7d880c8.jpg

Attachments (1)

4491.patch (1.4 KB) - added by milana_cap 3 months ago.

Download all attachments as: .zip

Change History (8)

This ticket was mentioned in Slack in #docs by zzap. View the logs.


4 months ago

@milana_cap
3 months ago

#2 @milana_cap
3 months ago

  • Keywords has-patch added; needs-patch removed

This ticket was mentioned in Slack in #docs by zzap. View the logs.


3 months ago

This ticket was mentioned in Slack in #docs by zzap. View the logs.


3 months ago

#5 @estelaris
3 months ago

  • Keywords needs-design added

This ticket was mentioned in Slack in #docs by zzap. View the logs.


3 weeks ago

This ticket was mentioned in Slack in #docs by zzap. View the logs.


13 days ago

Note: See TracTickets for help on using tickets.