Smart UI Components & Libraries – Grid, Scheduler, Gantt, Kanban for Angular, React, Next.js, Vue, Blazor, JavaScript › Forums › General Discussions › Card View › How to force to have only 2 cards per row ?

Tagged: ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • February 29, 2024 at 12:05 pm #109897
    fabriceb
    Participant

    Hi,

    My cards content lot of text, and I’d like to enlarge them, and force for example only 2 cards per row.

    Here is my codepen : https://codepen.io/mogador/pen/BaEaWzz

    Is there à way to change width of cards, and force responsive rows ?

     

    Best regards,

    fabriceb

    March 1, 2024 at 10:50 am #109908
    fabriceb
    Participant

    Here is the soluce : just change this css variable : –smart-card-view-column-min-width

    I do it directly in js after init of the cardview :
    <div>$(“#myCard”).css(“–smart-card-view-column-min-width”, “600px”);</div>
    <div></div>
    <div>fabriceb</div>

    March 1, 2024 at 2:50 pm #109911
    Markov
    Keymaster

    Thanks for the update, Fabriceb

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.