Make columns of equal width in
前端 未结 3 845
北海茫月
北海茫月 2020-12-05 09:37

How do I make columns of equal width in

?

I am dynamically changing the number of columns. Today I have 13 columns. Tomorrow it will be ra

相关标签:
3条回答
  • 2020-12-05 09:43

    I think that this will do the trick:

    table{
        table-layout: fixed;
        width: 300px;
    }
    
    0 讨论(0)
  • 2020-12-05 09:46

    Found this on HTML table: keep the same width for columns

    If you set the style table-layout: fixed; on your table, you can override the browser's automatic column resizing. The browser will then set column widths based on the width of cells in the first row of the table. Change your to and remove the inside of it, and then set fixed widths for the cells in .

    0 讨论(0)
  • 2020-12-05 09:49

    Use following property same as table and its fully dynamic:

    ul {
        width: 100%;
        display: table;
        table-layout: fixed; /* optional, for equal spacing */
        border-collapse: collapse;
    }
    li {
        display: table-cell;
        text-align: center;
        border: 1px solid pink;
        vertical-align: middle;
    }
    <ul>
      <li>foo<br>foo</li>
      <li>barbarbarbarbar</li>
      <li>baz klxjgkldjklg </li>
      <li>baz</li>
      <li>baz lds.jklklds</li>
    </ul>

    May be its solve your issue.

    0 讨论(0)
提交回复
热议问题