Rounded tables in Twitter Bootstrap 3

Question

Bootstrap 3 has dropped rounded corners on tables. Which styles should I apply to get them back when I apply the .table-bordered class, please?

Answer 1

The answer above on wrapping the table with a panel (

) seems to work the best.

However, as mentioned in the comments, you do need to remove the top border on the table.

I used this SCSS to do this, so thought I would share:

// remove extra top border on tables wrapped in a panel
.panel {
  & > .table-responsive > .table.table-bordered, & > .table.table-bordered {
    & > tbody:first-child, & > thead:first-child {
      & > tr:first-child {
        td, th {
          border-top: none;
        }
      }
    }
  }
}

0 讨论(0)

查看其它10个回答

发布评论:

提交评论

---

•  加载中...