Question

我的css工作原理很奇怪，除非我尝试将其中任何一个应用于其中一个 div id 11_tile或12 可以在我的CSS中有一条线来防止这种情况发生，我从未见过css样式不适用于某些div

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>

Answer 1

Id名称不能以数字开头（至少在firefox中不起作用），重命名为：＃tile_11，它会起作用。 http://jsfiddle.net/rh6UD/1/

#tile_11
{


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




}

Answer 2

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

例如：#tile11。

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

CSS - 一些css属性工作，其他人不影响div？

2 个答案: