如何调整div元素的大小小于其内容？

Question

我有一张桌子，单元格中有一个TreeView。这是我的代码：

   <style>
        #leftPanel
        {
            width:60px;
            height:'100%';
            border:1px solid red;
            background:yellow;
        }  
    <style>

        <table>
         <tr>
          <td> 
           <div id="leftPanel">
             <asp:PlaceHolder runat="server" ID="TreeView" />
             <%-- Here is a TreeView --%>
           </div>
          </td>
         </tr>
          <%-- other code --%>
        <table>

 $(function () {
         $('#leftPanel').resizable(
         {
             handles: 'e, w'
         });
     });

我无法将我的div的大小减小到比TreeView的大小更小。 我需要写什么代码才能让leftPanel小于TreeView的大小？如果TreeView节点的文本太长，则是必要的。

Answer 1

您可以在CSS中为div设置overflow属性。

将其设为overflow: auto;

DEMO