CSS值未应用于表行和标题

时间:2012-07-17 01:43:29

标签: css

enter code here我确信创建CSS只是为了弄乱我。

我在CSS文件中跟随他:

.tabletop
{
    padding: 0px; 
    margin: 0px; 
    border: none; 
    float: left; 
    width: 100%;     
}

.tableth
{  
  height: 15px; 
  background: #eef3e2;     
}

这在视图中:

<table id="editorRows" class="tabletop" cellspacing="0">
        <tr>                
            <th class="tableth">  
                <input id="ChkAll" type="checkbox" onclick="SetAllCheckBoxes(this)" />               
            </th>

仅强制执行表的格式,而不强制执行表标题元素。有任何想法吗?

按要求提供整个CSS:

/* Edit Tables */
.tabletop
{
    padding: 0px; 
    margin: 0px; 
    border: none; 
    float: left; 
    width: 100%;     
}

.tableth
{  
  height: 15px; 
  background: #eef3e2;     
}

body
{
    margin: 0;
    padding: 0;
    border: 0;
    width: 100%;
    background: #fff;
    min-width: 600px;
    font: normal 12px/1.2em Verdana, Tahoma, Arial, Helvetica, Georgia, Sans-Serif;
}
a
{
    color: #369;
}
a:hover
{
    color: #fff;
    background: #369;
    text-decoration: none;
}
h1, h2, h3
{
    margin: .8em 0 .2em 0;
    padding: 5px, 2px, 5px, 2px;
}
h1
{
    font-size: 12.3em;
}
h2
{
    font-size: 1.2em;
    color: #369;
}
h3
{
    font-size: 1.1em;
}
h4
{
    font-size: 1em;
}
p
{
    margin: .4em 0 .8em 0;
    padding: 0;
}
img
{
    margin: 5px 0;
}

/*fdfcdc*/
table, th, td 
{
    border: none;     
}



/* Header styles */
#header
{
    clear: both;
    float: left;
    width: 100%;
    border-bottom: 1px solid #000;
    background-color: #cccccc;
}
#header p, #header h1, #header h2
{
    padding: .4em 15px;
    margin: 0;
    line-height: 1.2em;
}
#header h1
{
    font-size: 1.2em;
}
#header h2
{
    font-size: 1.1em;
}
#header h3
{
    font-size: 1em;
    color: #fe7;
}

#navbar ul
{
    clear: left;
    float: left;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

#navbar ul li
{
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
}

#navbar ul li a
{
    display: block;
    float: left;
    margin: 0 0 0 1px;
    padding: 3px 10px;
    text-align: center;
    background: #eee;
    color: #000;
    text-decoration: none;
    position: relative;
    line-height: 1.3em;
}

#navbar ul li a:hover
{
    background: #369;
    color: #fff;
}
#navbar ul li a.active, navbar ul li a.active:hover
{
    color: #fff;
    background: #000;
    font-weight: bold;
}
#navbar ul li a span
{
    display: inline-block;
    margin: 0;
    padding: 10px 0;
}

#leftnavbar ul
{
    clear: left;
    float: left;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

#leftnavbar ul li
{
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
}

#leftnavbar ul li a
{
    display: block;
    float: left;
    margin: 0 0 0 1px;
    padding: 3px 10px;
    text-align: center;
    /*background: #eee;*/
    color: #000;
    text-decoration: none;
    position: relative;
    line-height: 1.3em;
}

#leftnavbar ul li a:hover
{
    background: #369;
    color: #fff;
}
#leftnavbar ul li a.active, #leftnavbar ul li a.active:hover
{
    color: #fff;
    background: #000;
    font-weight: bold;
}
#leftnavbar ul li a span
{
    display: inline-block;
    margin: 0;
    padding: 10px 0;
}

#header img
{
    padding-left: 10px;
}
/* The Real Status info sub menu */
#statusinfo
{
    clear: both;
    background: #eef3e2;    
    border-top: 3px solid #666;
    margin: 0;
    padding: 6px 15px !important;
    text-align: right;
}

#logindisplay
{
    clear: both;
    background: #eef3e2;    
    border-top: 3px solid #666;
    margin: 0;
    padding: 6px 15px !important;
    text-align: right;
}

.title
{
    position: fixed;
    left: 4px;
    top: -1px;
    float: left;
}

.title h2
{
}

/* keep label and input on same line
.editor-label-same-line { 
    float:  ; 
} 

.editor-field-same-line { 

} 

.editor-field-input-same-line { 

} */

/*border: 1px solid #C0C0C0;  */





/* Top Menu */
.topmenu
{
    float: right;
    position: relative;
}

/* Left Menu */
.leftmenu
{
    float: left;
    vertical-align: top;
}
/* column container */
.colmask
{
    position: relative; 
    clear: both;
    float: left;
    width: 100%; 
    overflow: hidden; /* This chops off any overhanging divs */
}
/* common column settings */
.colright, .colmid, .colleft
{
    /*float: left;*/
    /*width: 100%;*/
    position: relative;
    overflow: hidden;
}

.col, .col2, .col3
{
    position: relative;
    padding: 0 3em 1em 0;
    overflow: hidden;
}


.leftcol
{
    float: left;        
    height: 95%;
    width: 20%;
    left:  2px;     
    color: Black;
    padding: 2pc, 2pc, 2pc, 2pc;
    background: #ffffff; 
}

.rightcol
{
    float: left;
    height: 95%;
    width: 76%;  /*71*/
    left: 15px; 
    color: Black;
    padding: 2pc, 3pc, 2pc, 5pc;
    background: #ffffff;    
}


.leftmenu h2
{
    line-height:1.2em;
    font-size: 1.1em;
}
.leftmenu h3
{
    line-height:1.1em;
    font-size: 1em;
    color: #667;
}
.col2 ul
{
    margin: 5px 0;
    list-style: inside;
    list-style-type: square;
}
.col2 ul li
{
    margin-left: 15px;
    padding: 0;
}
/* Form layout elements */
fieldset 
{
    margin: 1em 0;
    padding: 1em;
    border: 1px solid #CCC;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset label 
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input[type="text"] 
{
    width: 200px;
    border: 1px solid #CCC;
}

input[type="password"] 
{
    width: 200px;
    border: 1px solid #CCC;
}
/* Footer styles */
#footer
{
    clear: both;
    float: left;
    width: 100%;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    background-color: #fdfcdc;
}
#footer p
{
    padding: 5px;
    margin: 0;
    position: relative;    
}

编辑_Layout.cshtml

中的Site.css
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>

2 个答案:

答案 0 :(得分:0)

我认为这可能有点帮助!正如您在以下示例中所看到的那样,您使用的高度太小而无法看到差异,因为复选框的高度为13px,几乎与整个{{1}的高度相同1}}(row

IMAGE

因此, css 正在应用,您只需要设置高度,稍微“15px”就像在此EXAMPLE

<强>更新

这是更新http://jsfiddle.net/luissanchezm86/QJmgd/1/,但我仍然没有看到错误!

希望这对你有所帮助!

答案 1 :(得分:0)

我感谢您的帮助和建议。我找到了两件事来解决这个问题。请记住,我在IDE中以调试模式运行MVC应用程序...我在原始问题中忽略了这一点。

虽然我在启动MVC3应用程序之前更改(并保存)了Site.css文件,但在某些情况下,在我刷新浏览器(F5)之前,更改并不明显。在其他情况下,刷新似乎不起作用。因此,在这些情况下,我使用任务管理器来杀死任何潜在的Development Server实例并重新启动该程序。