Question

我想要一个数据块，其宽度和高度必须自动调整到数据块的内部内容。我是通过将内容放在一个 display 样式的DIV标记中作为 inline-block 。如果存在DOCTYPE标记，它在所有浏览器中都能正常工作。如果DOCTYPE不存在，它不能在IE中工作（div宽度调整为浏览器的宽度）。但它适用于其他浏览器。有没有解决方案或任何替代方案......？任何身体都可以帮助我....

这是我的一段代码

<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style>
   .MultiSelectMenu{
     border:1px solid black;
     display:inline-block;
    }
   .MultiSelectMenu ul{
     margin:0px;
     padding:0px;
   }
  .MultiSelectMenu ul li{
    list-style:none;
    background:#abc4c9;
    border-bottom:1px solid #354e53;
    padding:2px 4px 2px 4px;
    cursor:pointer;
  }
  </style>
 </head>

 <body>
   <div class="MultiSelectMenu" >
     <ul>
       <li>Telugu</li>
       <li>Hindi</li>
       <li>English</li>
       <li>Marathi</li>
       <li>Kannada</li>
       <li>Malayalam</li>
     </ul>
  </div>
 </body>
</html>

Answer 1

添加

   .MultiSelectMenu { float: left; }

并在clear: left元素后面的元素上设置div。

Answer 2

你可以将Left Float添加到.MultiSelectMenu中，当你完成div时..在最后一个具有clear的.MultiSelectMenu div的结束标记之后添加空div：清除divs浮动的两种或左边样式。

例如：

.clear {
  clear:both; // or left
}

HTML：

<div class="clear"></div>

display：如果没有IE中的DOCTYPE，inline-block无法正常工作

2 个答案: