[wp-meta] [Making WordPress.org] #685: Need to responsive col-* classes throughout

Making WordPress.org noreply at wordpress.org
Tue Oct 28 06:27:24 UTC 2014


#685: Need to responsive col-* classes throughout
---------------------+---------------------
Reporter:  McGuive7  |      Owner:
    Type:  defect    |     Status:  new
Priority:  normal    |  Component:  General
Keywords:            |
---------------------+---------------------
 Column classes (e.g. col-10) are used throughout the .org site to layout
 content and sidebar areas, and possibly other elements as well. At present
 these col-* classes:

 1. Are styled with pixel width values, and
 2. Aren't responsive (no media queries)

 I propose we:

 1. Switch to percentage values to allow for fluid scaling and prevent
 unexpected wrapping
 2. Move all CSS width definitions inside a min-width media query so that
 all columns are full-width below a certain breakpoint and then become a
 percentage of the full viewport above a certain width.

 I'm happy to do this - it could be a pretty quick change in wp4.css -
 however I would first like some feedback on the following questions:

 1. Can anyone give me a good overview of where/how column classes are used
 throughout .org?
 2. I see that the forum does have some responsive CSS for columns in a
 separate stylesheet (forum-wp4.css) - is there a reason why this is
 separated out?

 Also just noticed there's a bunch of specific nested col-* selectors (e.g.
 .col-10 .col-5) also with explicit widths. . .

 I guess the other question is - is this worth cleaning up? Is there any
 interest in an overhaul to really clean things up (e.g. minimize
 selectors, move to all mobile first, make rule order consistent)? Might be
 possible to work through one site at a time. . .

 New here so would love to know what the normal mode of operation is.

--
Ticket URL: <https://meta.trac.wordpress.org/ticket/685>
Making WordPress.org <https://meta.trac.wordpress.org/>
Making WordPress.org


More information about the wp-meta mailing list