Making team-list into multicolumn doesnt work

  • Resolved af3

    (@af3)


    3 years, 8 months ago

    Hi, i am trying to add customizer’s css like this (to venue & team list pages) to make the list appears in two columns:

    ol.team-list, ol.stadium-list {
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
}

    But the team lists or venue lists do not show up; or simply crash chrome ?? Are you guys seeing the same thing ?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author AntoineH

    (@antoineh)

    There seems to be a conflict with the floats that are on the elements. The floats are not needed, so we can remove them:

    img.stadium-photo.thumb.stadium-list, img.team-photo.thumb.team-list {
    float: none;
}

ol.team-list li, ol.stadium-list li {
    clear: none;
}

ol.team-list, ol.stadium-list {
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
}

    The above works in my twenty twenty-one theme.

    Thread Starter af3

    (@af3)

    That works. You are awesome!

    Thread Starter af3

    (@af3)

    I added this to make the text appears on top.

    ol.team-list li a, ol.stadium-list li a {
    display: flex;
    align-items: top;
}
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Making team-list into multicolumn doesnt work’ is closed to new replies.