Div没有正确显示

时间:2015-12-29 13:44:45

标签: html css asp.net

我是Asp.Net和CSS的新手 我希望div标题固定,左下方div固定。并根据百分比右侧两个div宽度。所以我试过这个

CSS

    left: 0px;
    position:fixed ;
    z-index: 2;
    border-bottom: 1px solid #00e5e6;
}
  #DivLogo
    {
        height: 80Px;
        width: 350px;
        position:fixed;
        margin-left: 20px;
        margin-top: 10px;
        border:1px solid #aaac62;
        -webkit-border-radius:15px;
        -moz-border-radius:15px;
        border-color:Blue

    }
     #DivShow
    {
        height: 30Px;
        width: 350px;
        position:fixed;
        float:left;
        margin-left: 20px;
        margin-top: 95px;

    }

     #DivRight 

   {   height: 70px;
       width: 150px;
       position:fixed;
       left: 85%;
       margin-top: 10px;
    top: 0px;
}

    #DivMenuRight 
   {  
       height: 30Px;
       width: 500px;
       position:fixed;
       right:15%;
       margin-top: 95px;
   }
   #DivBody  
{
    width: 100%;
    height: 380px;
    position: fixed;
    margin-top: 155px;
    margin-bottom: 20px;
    top: 4px;
    left: -2px;
    margin-left: 0px;
    margin-right: 0px;
}
#DivLeft
 {
    width: 200px;
    height: 100%;
    position: fixed;
    float: left;
    border-right: 1px solid #00e5e6;
 }
  #DivBodyRight
 {
    height: 100%;
    position:absolute;
    float: left;
    right:0px;
    left:200px;
    top: 156px;
}
 #DivVersion, #DivRelease, #DivUserAccount, #DivOther
 {
    width:70%;
    height: 100%;
    position:absolute;
    float: left;
    top:0px;
    left:0px;
    border-Right: 1px solid #00e5e6;
 }
 #grdVersions, #grdRelease, #grdUserAccount, #grdOther
 {
     width:100%;
     height:100%;
 }

 #DivUserDetail
 {
    width: 30%;
    height: 100%;
    position:absolute;
    float: right;
    right:0px;
    top:0px;
    border-Left: 1px solid #00e5e6;
 }

ASP.Net

<div id="DivMain">
       <div id="DivHeader">
         <div id="DivLogo">
         </div>
         <div id="DivShow">

       </div>
        <div id="DivRight">

         </div>
          <div id="DivMenuRight">

         </div>
       </div>
       <div id="DivBody">
       <div id="DivLeft">

       </div>
       <div id="DivBodyRight">
        <div id="DivVersion" runat=server>

       </div>
       <div id="DivUserDetail">
       </div>
        </div>
        </div>
    </div> 

小提琴https://jsfiddle.net/fsp1vw2u/

右下方div未正确显示。从中间开始。 这里有什么问题?

正在使用visual studio 2008 and CSS 2.1

1 个答案:

答案 0 :(得分:2)

将位置absolute更改为fixed

#DivBodyRight {
    float: left;
    height: 100%;
    left: 200px;
    position: fixed;
    right: 0;
}

https://jsfiddle.net/fsp1vw2u/9/