18

这是我页面侧边菜单的小代码

<div style="display: block;" id="overlay" class="overlay">
    <div id="sideMenuGroups">
    <div id="sideMenuGroupHeader" class="mSideMenuSeparator">GROUPS</div>
      <div id="sideMenuGroupContent" class="mSideMenuContent">
           <div id="teacherGroup">As Teacher
             <a onclick="groupFeeds();" href="#">Data Mining</a>
             <a onclick="groupFeeds();" href="#">Data Structures</a>
             <a onclick="groupFeeds();" href="#">C Language</a>
              //**display anchor tag to full width of overlay**
             <a onclick="groupFeeds();" href="#">Introduction to IT</a>
           </div>
          </div>  
    </div>
    </div><!--overlay ends here-->

所用样式的 CSS 是

* mSideMenuConten *t 没有定义样式

mSideMenuContent a - 告诉每个锚标记如何可见，我尝试过 display:table-cell属性，但它对我无效

覆盖告诉侧菜单将如何

.mSideMenuContent
{

}
.mSideMenuContent a
{
    display: table-cell;
    height: 37px;
    color: #c4ccda;
    padding: 3px 0 3px 8px;
    font-size: small;

}
.mSideMenuContent a:hover
{
  background:#262c3a;
  color: #c4ccda;
}   
.mSideMenuSeparator
{
    background: #434b5c;
    border-top: 1px solid #242a37;
    border-bottom: 1px solid #242a37;
    font-family:Helvetica, sans-serif;
    font-size:x-small;
    color: #7a8292;
    height:17px;
    padding-top:4px;
    padding-left: 10px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .6)
}
    .overlay {
    z-index: 1000;
    position: absolute; 
    top: 0;
    bottom: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background:#31394a;;
    color: #c4ccda;
    display: none;
}

我想将锚标签显示为侧边菜单的全宽，我该怎么做？

4

1 回答 1

56

用这个：

display:inline-block;
width: 100%;

通过说内联块，您可以自己定义元素的宽度。默认情况下，内联元素不能这样做。

于 2012-08-07T18:33:41.363 回答