css HACK问题(display:table-cell)

第十种:display:table-cell兼容IE7以上

html代码为:

<div class="articleSide">
          <div class="row">
          <div class="articleMenu">
               <ul>
                   <li class="ddnav"><a href="">讲师团<em>></em></a></li>
                   <li class="ddnav hover"><a href="">资讯<em>></em></a></li>
                   <li class="ddnav"><a href="">品牌简介<em>></em></a></li>
               </ul>
          </div>
          <div class="articleMain">
               <div class="articleList">
                    <ul>
                        <li><a href="">
                             <div class="Img"><img src="images/img.png"></div>
                        </a></li>
                    </ul>
               </div>
          </div>
          </div>
     </div>

CSS代码为:

 

.articleSide{ width: 100%; display: table;}
.articleSide .row{display: table-row;}
.articleMenu{ background-color:#fff; width: 156px; padding: 0 8px; vertical-align: top; margin-right: 20px;display: table-cell;*display:inline; *zoom:1;}
.articleMain{ background-color: #fff; border-left:20px solid #f8f8f8;*border-left:none; display: table-cell;*display:inline; *width:auto; *zoom:1; width: 1008px;}

 

posted @ 2017-09-27 11:47  chenguiya  阅读(137)  评论(0)    收藏  举报