已修复固定分区

Question

ASP.NET和CSS的新用户。 我需要在标题中显示固定Div和固定菜单。并且固定标题Div有底部边界线，并且它在底部ul的顶部还有另一个ul，如此

                       Admin

 New                image 1 image 2 image 3 image 4
 ---------------------------------------------------------

所以我尝试了这样

CSS

 #DivHeader
    {
        width: 100%;
        height: 125px;
        top: 0px;
        left: 0px;
        position:fixed ;
        z-index: 2;
        border-bottom: 1px solid #00e5e6;
    }
      #DivShow
    {
        height: 30Px;
        width: 350px;
        position:fixed;
        float:left;
        margin-left: 20px;
        margin-top: 95px;

    }

       #DivRight 
       {   height: 80Px;
           width: 150px;
           position:fixed;
           left: 85%;
           margin-top: 10px;

       }
        #DivShow ul
    {
    position: relative;
    height: 20px;
    width :200px;
    display:inline-block ;
    font-size: 14px;
    color: #1570a6;
    list-style:none;
    top: 50%;
    margin-top: -10px;
    margin-left: 129px;
    margin-right: 10px;
    margin-bottom: 0px;
    padding: 0px;
    }
    #DivShow li{float:left;position:relative; cursor:pointer;}
        #DivMenuRight 
       {  
           height: 30Px;
           width: 500px;
           position:fixed;
           right:15%;
           margin-top: 95px;
       }

     #DivRight ul {  position:absolute;
                        width :100px; margin-left:5px; }
       #DivShow li{float:left;position:relative; cursor:pointer;}

        #DivRight ul
        {
            height: 100%;
            text-align:center;
            color: #1570a6;
            list-style:none;
            text-decoration:none;
            table-layout:fixed;
            display:table;

        }

       #DivRight li{cursor:pointer; display:table-cell; 
       margin-top:40px; height:20px; float:left;}

       #UlIcon
       {
        height: 100%;
        list-style:none;
        text-align:center;
        padding-left: 5px;
        text-decoration:none;
       }

        #UlIcon li {float:right; margin-left:25px;  width : 40px; height:100%;}

        img {
         display:inline-block;
         width:40px;
         height:100%;
         cursor:pointer;
        }

ASP.NET

    <div id="DivHeader">
 <div id="DivShow">
         <ul> <li> Show All </li></ul>
       </div>
             <div id="DivRight">
             <ul> <li > Admin </li></ul>
             </div>
              <div id="DivMenuRight">
                     <ul id="UlIcon">
                     <li id="LiLog"> <img src="IMG/New.png" alt="" /></li>
                     <li id="LiDelete"> <img src="IMG/Delete.png" /></li>
                     <li id="LiSave"> <img src="IMG/Save.png" /></li>
                     <li id="LiNew"> <img src="IMG/New.png" /> </li>
                    </ul> 
             </div>
           </div>

但是底部边界线只与图像重叠，所以我如何才能得到解决方案？ 这里有什么问题？

正在使用Visual Studio 2008 and CSS 2.1

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