How to focus on one column independently of other columns or rows

  • Hello,

    I am trying to find out if there is a way to focus on a single column independently of other columns or rows.

    I have searched the forums and I’ve figured out this code so far, but it only changes all columns indepently, I need to add to it to only focus on row one.

    .column.size-1of3:nth-child(1) { width: 50% !important;}

    I am trying to achieve something like this… https://www.screencast.com/t/GNJODhIG3

    Any help would be much apreciated.

    Thanks.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • You can’t, really, because of the way the columns are done.
    If you use 

    .column.size-1of3:first-child {
    width: 50% !important;
}

    you get this:

    And if you use

    .column.size-1of3 article:first-child {
    width: 50% !important;
}

    you get this:

    You would need to use a different structure than the columns that you are currently using.

    Thread Starter carterkay

    (@carterkay)

    Thanks Joy… I have done some more digging and I think CSS grids is the best way forward.

    I have looked online and I’ve come across this tutorial which uses CSS grids.

    https://divisoup.com/how-to-use-css-grid-with-divis-feed-modules/

    I can use the following which will add CSS grid to my post feed, but I can’t find out how to span across several cells independently?

    .ds-grid-blog .et_pb_ajax_pagination_container {
    display: grid;
    grid-template-columns: repeat(5, 18%);
    grid-column-gap: 2.5%;
    }

    I am trying to achieve something like this… https://www.screencast.com/t/GNJODhIG3

    Thanks

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to focus on one column independently of other columns or rows’ is closed to new replies.