Request: 4-Column Text Block on Desktop / 2-Column Text Block on Mobile

jmerrill · December 1, 2023

I have the following CSS that I'm using to change a single text block to 4 columns on desktop. However, I'd like to force the same text block to 2 columns on mobile:

// Multi-Column Text //
#block-yui_3_17_2_1_1698600219155_10162
{p {column-count:4; column-gap:5%;}
}

URL: https://liftin.me/movements
PW: lifting

Edited December 1, 2023 by jmerrill

CassAggett · December 2, 2023

Try this:

// Multi-Column Text Mobile //
@media only screen and (max-width: 767px) {
  #block-yui_3_17_2_1_1698600219155_10162 {
  p { column-count:2; column-gap:5%;}}
}

jmerrill · December 2, 2023

Perfect - thank you @CassAggett

Request: 4-Column Text Block on Desktop / 2-Column Text Block on Mobile

Recommended Posts

jmerrill

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

jmerrill

CassAggett

Link to comment

jmerrill

Link to comment

Create an account or sign in to comment

News

jmerrill

Circle Benefits

Events

Circle Day

Resources

Product Updates

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources