無論文本內容大小如何，如何確保列內容對齊

Question

我遇到了這種尷尬的情況，我總是避免處理..

由於文本內容大於第二個文本列，您可以注意到第一個文本列換行。 這會產生使項目錯位的額外空間。

這是 HTML：

<section class="featured">
        <div class="container">
            <div class="row">
                <div class="col-xs-12 col-lg-4">
                    <h3><strong>Work in all areas of Sales & Operations:</strong></h3>
                    <ul>
                        <li>- Delivery Merchandiser</li>
                        <li>- Bulk Merchandiser</li>
                        <li>- Account Developer</li>
                        <li>- Space Management Specialist</li>
                        <li>- Forklift Driver & Warehouse Laborer</li>
                    </ul>
                </div>
                <div class="col-xs-12 col-lg-4">
                    <img src="./logo.png" alt="logo">  
                </div>
                <div class="col-xs-12 col-lg-4">
                    <h3><strong>This role is for you if you:</strong></h3>
                    <ul>
                        <li>- can travel extensively</li>
                        <li>- are highly flexible</li>
                        <li>- are deployable at little notice</li>
                        <li>- can adapt quickly to change</li>
                        <li>- are highly motivated</li>
                    </ul>
                </div>
            </div>
            <div class="row">
                <h4 class="text-center"><strong>We offer great rewards, competitive pay, career advancement & growth opportunities</strong></h4>
            </div>
        </div>
    </section>

順便說一句，我正在使用引導程序。

Answer 1

這將防止發生自動換行。 它可能會導致其他問題。 設置斷點和調整font-size可能是更好的解決方案。

斷點 - 媒體查詢文檔

<h3><strong style="white-space: nowrap;">Work in all areas of Sales & Operations:</strong></h3>