竞争的CSS样式表

我试图消除对特定的表边框：竞争的CSS样式表

<table class="teacher"> 
    <tr> 
     <td>row 1</td> 
     <td>col 1</td> 
     <td>col 2</td> 
    </tr> 
    <tr> 
     <td>row 2</td> 
     <td>col 1</td> 
     <td>col 2</td> 
    </tr> 
</table>

你可以看到我的小提琴here

我觉得bootstrap.css与我site.css竞争，但我不确定如何摆脱边界？

这里是我的老师（来自site.css）造型：

.teacher { 
    text-align: left; 
    padding: 0; 
} 

.teacher table { 
     border: none !important; 
     border-collapse:collapse !important; 
} 

.teacher .contentLabel { 
    width: 45%; 
} 

.teacher input { 
    width: 10px; 
    padding: 0px; 
} 

.teacher textarea { 
    width: 225px; 
    padding: 0px; 
}

我的包：

 bundles.Add(new StyleBundle("~/Content/css").Include(
      "~/Content/site.css", 
      "~/Content/bootstrap.css", 
      "~/Content/bootstrap-theme.css", 
      "~/Content/bootstrap-duallistbox.css", 
      "~/Content/jquery.dataTables.css"));

我想这是从引导导致此问题：

.table { 
    width: 100%; 
    margin-bottom: 20px; 
} 
.table > thead > tr > th, 
.table > tbody > tr > th, 
.table > tfoot > tr > th, 
.table > thead > tr > td, 
.table > tbody > tr > td, 
.table > tfoot > tr > td { 
    padding: 8px; 
    line-height: 1.428571429; 
    vertical-align: top; 
    border-top: 1px solid #ddd; 
} 
.table > thead > tr > th { 
    vertical-align: bottom; 
    border-bottom: 2px solid #ddd; 
} 
.table > caption + thead > tr:first-child > th, 
.table > colgroup + thead > tr:first-child > th, 
.table > thead:first-child > tr:first-child > th, 
.table > caption + thead > tr:first-child > td, 
.table > colgroup + thead > tr:first-child > td, 
.table > thead:first-child > tr:first-child > td { 
    border-top: 0; 
} 
.table > tbody + tbody { 
    border-top: 2px solid #ddd; 
} 
.table .table { 
    background-color: #fff; 
}

来源

2014-02-17 webdad3

在行中注释出<td>的边界94。

td { 
    color: #000; 
    /* border: 1px solid #7c7c7b; */ 
    padding: .3em 1em; 
    text-align: left; 
}

CSS的附加件要记住，如果你曾经使用表<thead>和<th>元素：

103线：

th { 
    color: #7c7c7b; 
    font-weight: 700; 
    font-size: large; 
    text-align: center; 
    /* border: 1px solid #7c7c7b; */ 
    padding: .3em 1em; 
}

行112：

th.th2 { 
    color: #7c7c7b; 
    font-weight: 300; 
    font-size: large; 
    text-align: center; 
    /* border: 1px solid #7c7c7b; */ 
    padding: .3em 1em; 
}

来源

2014-02-17 22:19:41 jonsuh

谢谢我欣赏答案。 – webdad3

那么在您提供的的jsfiddle的CSS线90

td { 
    color: #000; 
    border: 1px solid #7c7c7b; 
    padding: .3em 1em; 
    text-align: left; 
}

这是什么原因造成的边界..

所以规则是在td元素，而不是table

使用

.teacher td{border:none;}

应该解决这个问题..

演示在http://jsfiddle.net/gaby/R6X2M/2/

来源

2014-02-17 22:19:48

谢谢我欣赏它！ – webdad3

竞争的CSS样式表

回答

相关问题