SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2013
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Responsive columns

    Say I have 12 input fields that should be arranged as 3x4, 2x6 or 1x12 depending on viewport width.

    It seems pretty easy to arrange the columns like this (with this method, for example: http://webdesignerwall.com/tutorials...lumn-layouts):

    1 2 3
    4 5 6
    7 8 9
    10 11 12

    1 2
    3 4
    5 6
    7 8
    9 10
    11 12

    1
    2
    3
    etc.

    But what I want is this:

    1 5 9
    2 6 10
    3 7 11
    4 8 12

    1 7
    2 8
    3 9
    4 10
    5 11
    6 12

    1
    2
    3
    etc.

    Does anyone have any suggestion how to achieve this with HTML/CSS only (i.e. without JavaScript)?

  2. #2
    SitePoint Enthusiast
    Join Date
    Apr 2013
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    (I didn't find any edit button - is there any?)

    PS. I'm aware of the column-count possibility, but I wanted something more IE-friendly, and I'd rather not duplicate any of the fields (and hide either one in the set depending on width).


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •