Html 如何将div框的宽度设置为其内容的宽度？

我有一张有固定右侧边栏的桌子。这个右边的边栏现在的宽度是420px。但是宽度应该始终是内容的宽度

我用

auto

试过了，但是固定右侧的设计已经不起作用了。你知道吗

代码如下：

<div id="wrapper">
    <div id="content" style="overflow-x:scroll">
        <table class="table table-striped table-bordered">
            <thead>
                <tr>

                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>                
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                    <th>Lorem ipsum</th>
                </tr>
            </thead>
            <tbody>

<tr> <td>Lorem ipsum</td><td>Lorem ipsum </td><td>Lorem ipsum</td><td>Lorem ipsum</td><td>Lorem ipsum<br><td>Lorem ipsum</td><td>Lorem ipsum</td><td>Lorem ipsum </td><td> Lorem ipsum</td><td>Lorem ipsum</td><td>Lorem ipsum</td><td>Lorem ipsum</td><td>Lorem ipsum</td></tr> <tr> <td>Lorem ipsum</td><td>Lorem ipsum </td><td>Lorem ipsum</td><td>Lorem ipsum</td><td><td>Lorem ipsum</td><td>Lorem ipsum</td><td> </td><td> Lorem ipsum</td><td>Lorem ipsum</td><td></td><td></td><td></td></tr>          

              </tbody>
            </table>
        </div>



            <div id="sidebar">
                 <table class="table table-striped table-bordered">
                    <thead>
                        <tr>
                            <th>Lorem ipsum</th>
                        </tr>
                    </thread>
                <tbody>     

                <tr><th>Lorem ipsum<tr><th>Lorem ipsum  </tbody>
    </table>
    </div>
<div id="cleared"></div>

---

轻松将固定类名添加到侧栏中的表中，并添加以下css：

.fixed {
 table-layout: fixed;
 width: auto;
}

<div id="sidebar">
<table class="fixed table table-striped table-bordered">

。已修复{
表布局：固定；
宽度：自动；
}

Tables for layout是一种非常古老的网页布局方法。它极不灵活，而且有更好、更灵活的选择。签出并检查数据表。。。谢谢，我一定会看的，但是对于这种情况下的表格布局，没有任何解决方案吗？嗨，我尝试了你的解决方案，但是有些东西不起作用。这是你的结果：抱歉，只是将宽度更改为自动，所以对不起，我猜你理解我错了：我用粉色为你标记了我需要的自动宽度：我没有看到更改，很遗憾，你更新了什么？这看起来很好，谢谢！只有当我把内容缩短时，整张桌子才不是100%的窗口：你知道我的意思吗？

.fixed {
 table-layout: fixed;
 width: auto;
}

<div id="sidebar">
<table class="fixed table table-striped table-bordered">