queue  40
support
Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: custom columns per row

  1. #1

    custom columns per row

    hello,

    I'd need to have 5 member in a same "team" row but 3 items in another "process" row. I tried with this custom css:

    @media (min-width: 768px) {
    .about-detail-slider .large-4 {width: 20%;}
    }

    But the result is that also the process switch to 5 columns.
    How can I do that?
    Thank you so much

  2. #2
    Administrator Donagh's Avatar
    Join Date
    Aug 2011
    Posts
    2,078
    Try this instead:

    Code:
    @media (min-width: 768px) {
    .about-detail-slider .slides > li:nth-child(3) .large-4{
    width:20%;
    }
    }
    This snippet assumes that the team members item is number 2 in the list, just like in our demo. If you have a different sequence you'll need to change the "(3)" part in the above snippet to suit. Set it to one highter than the team section's position in the sequence.

  3. #3
    Hello,

    I tried with (2), the only position that works, but it also change the row that I want to keep with 3 items.

  4. #4
    Administrator Donagh's Avatar
    Join Date
    Aug 2011
    Posts
    2,078
    Try changing the 20% to 19.999%. If this doesn't work leave the solution active and share your url so I can check.

  5. #5
    Ok, I changed to 19.999% but it doesn't work. Here is the url: http://beecofarm.it/
    The 5 "aree di attivitą" should be in a same row...
    Thank you!

  6. #6
    Administrator Donagh's Avatar
    Join Date
    Aug 2011
    Posts
    2,078
    Hi,

    You have written the css % value incorrectly, you have 19,999% when it should be 19.999% When it comes to code, these things are enough to break something. Fix this and it will work as expected.

  7. #7
    Hi,

    I changed 19,999 with 19.999, but still does not work...

  8. #8
    Lead Support Ante's Avatar
    Join Date
    Oct 2012
    Posts
    16,930
    Hi, try this css:

    Code:
    @media (min-width: 768px) {
    .about-detail-slider .slides > li .large-4{
    width:20%;
    }
    }

  9. #9
    Hello, it works but it also change the row that I want to keep with 3 items.

  10. #10
    Administrator Donagh's Avatar
    Join Date
    Aug 2011
    Posts
    2,078
    Hi, Then the CSS selector is too general, it need to be modified to target only that row. In order to help I need to see which is the other row, which you wish to keep to 3 items. Which one is that?