javascript - Flexbox:自动宽度到标题,自动到段落

标签 javascript html css flexbox

我有一个 flexbox div,它是合理的开始和对齐的开始。在那个 div 里面有两个 div,第一个包含一个 h1,第二个包含一个段落。

我正在尝试设置一个 flexbox 配置,以便 div 1 始终是标题 (h1) 的宽度,其余空间由带有段落的第二个 div 占用。

这是我的设置:

<div class="flex flex-justify-start flex-align-start">
    <div class="title">
        <h1 id="landingHeader">Headline</h1>
    </div>

    <div class="text">
        <p>Duis porttitor, neque in egestas pretium, nisl velit facilisis turpis, nec scelerisque nibh est faucibus purus. Nam ullamcorper facilisis turpis, sagittis varius turpis luctus in. Mauris pulvinar erat eget nisi tincidunt venenatis.</p>
    </div>
</div>

最佳答案

我已经知道了... 它是将 div.title 的 flex-shrink 属性设置为 0,将 div.text 的 flex-grow 属性设置为 1 并将 flex-shrink 属性设置为 1 的组合

关于javascript - Flexbox:自动宽度到标题,自动到段落,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28484297/

相关文章:

javascript - JQuery Ajax 成功后弹出窗口不会打开

c# - C# 中的 HttpWebRequest?

html - Svg 内部未与中心对齐

html - 如何在屏幕中间设置我的网站加载器

javascript - document.fullScreen 歌剧

javascript - 完整的 Ajax 站点,自动从 "normal"URL 重定向到 Ajax(片段)URL?

html - 使用 CSS 填充标题滚动条的宽度

javascript - 使用 JavaScript 将 HTML 对象添加到 DOM。显示空白

php - 在一列中显示 3 个产品并滚动行

css - 为什么这个 CSS 在 IE8 中不起作用?