0

奇怪的是我所有的css如何工作,除非我尝试对那些div id 11_tile或12中的任何一个应用一些东西,我的css中是否有一行可以防止这种情况发生,我从来没有见证过css样式不适用于某些div

这是我的证明,http://jsfiddle.net/rh6UD/

body
{
    background-color: blue;


    overflow: auto;
    /*-webkit-user-select:none;*/

    white-space:nowrap;

}

#wrapper {
    position:absolute;
    top:50px; bottom:50px; left:0;
    width:100%;
    background:green;
    overflow:auto;
}

#leftarea
{
    background-color: skyblue;
    width: 720px;
    display: inline-block;
    vertical-align: top;


}
#rightarea
{
    background-color: white;
    width: 2000px;
    display: inline-block;
    height: 580px;
}
#mainwindow
{
    margin-top: 15px;
    max-height: 600px;
    background-color:black;
    height: 600px;
    width: 3000px;
    padding: 5px 5px 5px 5px;



}
#search_tile
{
    background-color: yellow;
    height: 50px;
    width: 350px;
    display: inline-block;
}
#timeline_tile
{
    margin: 5px;
    position:relative;
    width: 250px;

    height: 580px;
    background-color: white;
    display: inline-block;

}
#conversations_tile
{

    top: 5px;
    vertical-align: top;
    position:relative;
    width: 250px;
    height: 375px;
    background-color: gray;
    display: inline-block;
}
#source_tile
{
    vertical-align: bottom;
    background-color: yellow;
    width: 450px;
    height: 200px;
    display: inline-block;
    position:relative;
    left: -255px;
}





#11_tile
{


    background-color: yellow;
    width: 450px;
    height: 200px;
    display: inline-block;





}



<div id="wrapper" class="wrapper">


    <div>   <!-- TOP PART -->


        <div id="search_tile" class="search_tile">search</div>


    </div>   <!-- TOP PART -->

    <div id="mainwindow">                   <!-- main window wrapper -->

        <div id="leftarea" class="leftarea">     <!-- LEFT AREA -->


            <div id="timeline_tile" class="timeline_tile">asdfasdfadsf
                <input type="text" name="lala"></div>
            <div id="conversations_tile" class="conversations_tile">asdfasdf</div>
            <div id="source_tile" class="source_tile">asdfasd</div>

        </div>     <!-- END LEFT AREA -->

        <div id="rightarea" class="rightarea">   <!-- RIGHT FIRST AREA -->

            <div id="11_tile" class="11_tile">1/1 full tile</div>
            <div id="14_tile" class="14_tile">1/4</div>
            <div id="12_tile" class="12_tile">1/2</div>
            <div id="13_tile" class="13_tile">1/3</div>
            <div id="23_tile" class="23_tile">2/3</div>
            <div id="34_tile" class="34_tile">3/4</div>

        </div>   <!-- END RIGHT FIRST AREA -->


    </div>    <!-- END MAIN WINDOW -->


</div>
4

2 回答 2

4

id名不能以数字开头(至少在firefox下不行),重命名为:#tile_11,就可以了。 http://jsfiddle.net/rh6UD/1/

#tile_11
{


    background-color: yellow;
    width: 450px;
    height: 200px;
    display: inline-block;




}
于 2013-06-17T23:19:36.527 回答
0

ID 不允许以数字开头。请将它们更改为另一个 ID 名称。

例如:#tile11

ID如果元素以数字开头,CSS 不会影响元素。

于 2013-06-17T23:19:54.427 回答