• Saturday , 6 June 2020

Custom Column Widths in Bootstrap Tables

Code Canyon
https://i.ytimg.com/vi/uWPeEl9Ok_s/hqdefault.jpg



One of the biggest things I’ve run into with Bootstrap are their tables which are dynamic and grow and shrink depending on content size. For the most part this is completely desired. Every now and then you want a bit more control over your table column widths. This is a very simple trick that I wanted to document for those who have run into the problem of wanting more control than Bootstrap gives initially.

This video walks through a few tricks to allow you to control the width of each column in your Bootstrap table. I also show how to add a nice ellipsis on content that is too large for a given column.

This specific blog post can be found at http://ericsaupe.com/custom-column-widths-in-bootstrap-tables/.
You can read more about this and other topics at my blog, http://ericsaupe.com

Original source

3d Ocean

Related Posts

10 Comments

  1. Michael White
    July 23, 2019 at 14:27

    what if you have more than 12 columns? i have a table with 23 columns

  2. vincej151
    July 23, 2019 at 14:27

    followed your advice to the letter. Can't make it work. bummer.

  3. Guilherme Tufaile
    July 23, 2019 at 14:27

    Thanks so much

  4. ram pratap
    July 23, 2019 at 14:27

    Very nice, Thanks, what if we want to show the full wrap text ?

  5. Michael John Tejero
    July 23, 2019 at 14:27

    Thanks for this! Really helpful with this simple table stuff 🙂

  6. Giles Rafol
    July 23, 2019 at 14:27

    Finally a solution! Was tired of multiple tables on a page, all with the same columns, having their own column widths. Looked so…messy. Thanks for posting this!

  7. Milan Dragaš
    July 23, 2019 at 14:27

    Nice tip, thanks! I have one question though: What if we have more than 12 columns inside table?

  8. _destruct
    July 23, 2019 at 14:27

    Great tip, thx! 😉

  9. Gilson DElrei
    July 23, 2019 at 14:27

    Thank you for share! It's a good tip!

  10. Guerino Rodella
    July 23, 2019 at 14:27

    Nice tip! This will help me in the future, thanks for teaching

Leave A Comment

You must be logged in to post a comment.