Flexbox-停止将所有元素折叠成一行

Question

我在flex容器中有一些物品，它们都包裹在一行上。我希望他们都是弹性孩子，但我希望H1自己行。

<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<div id="App"></div>

CSS

    <div className="issue-page">
        <div className="issue-title">
            <h1>{issue.title}</h1>
        </div>
        <h2>{issue.number}</h2>
        <div className="issue-details">
            <span className="issue-state">{issue.state}</span>
            <p>{issue.user.login} opened this issue {formatDistance(new Date(issue.created_at), Date.now())} . </p>
            <span>{issue.comments} comments</span>
        </div>
        <div className="issue-body">
            <p><strong>{issue.user.login}</strong> comment{formatDistance(new Date(issue.created_at), Date.now())} . </p>
            <p>
            {issue.body}
            </p>
        </div>
    </div>

图片