html - 如何使容器 div 与其中的 h1 元素一样宽

Question

我需要容器 div 与 h1 元素一样宽，并随着字体大小的变化而变化。目前一切都与页面一样宽。

这是代码:

<div id="container">
<h1>ABCDEFGH</h1>
<nav id="site-navigation" class="main-navigation" role="navigation">
        <div class="main-menu-container">
            <ul id="menu-main-menu" class="nav-menu">
                <li><a href="#">About</a></li>
                <li><a href="#">Menu item 2</a></li>
                <li><a href="#">Credits</a></li>
                <li><a href="#">Test item 4</a></li>
            </ul>
        </div>      
</nav>
</div>

我该怎么做？谢谢!

Answer 1

设置容器div的显示为inline-block

<div id="container" style="display:inline-block">

您也可以将此行添加到您的 CSS 文件中

#container { display: inline-block; }