html - 为什么我的文本换行到第二行？

Question

我正在尝试使我的文本正确对齐。但是，当有长标题或描述时，它不会扩展。下面是我的..

截屏：

“论坛”很好，但“今天订阅！” 不像“论坛”那样呆在一条线上。当有长文本时会发生这种情况。此外，描述也是如此。

HTML：

<div class="hotcampaign-container">
    <a href="' . $item['url'] . '">
        <div id="campaigns_image">
            <img src="' . $item['image_url'] . '" align="left" alt="' . $item['caption'] . '" />
    </a>    </div>
    <div id="campaigns_caption">' . $item['caption'] . '</div>
    <div id="campaigns_desc">' . $item['desc'] . '</div>
    <div id="campaigns_link">
        <a href="' . $item['url'] . '">
            <div align="right">More Info &raquo;</div>
        </a>
        </p>
    </div>
<br />
</div>

Div ID 的 CSS：

#campaigns_image {
    padding: 0px 10px 10px;
}
#campaigns_caption {
    padding: 0px 177px 0px;
    font-weight: bold;
}
#campaigns_desc {
    padding: 0px 177px 0px;
}
#campaigns_link {
    padding: 0px 10px 0px;
}

Answer 1

尝试

#campaigns_caption{
    padding: 0px 177px 0px;
    font-weight: bold;
    width:auto;
    min-width:300px;//some px according to te scenario
}

Answer 2

为呈现“今天订阅”文本whitespace:nowrap;的classor添加一个。id<div>

Answer 3

尝试删除#campgaigns_captiondiv 的 css 的填充：

#campaigns_caption {
    padding: 0px 0px 0px;
    font-weight: bold;
}

Answer 4

尝试 空白：nowrap

#campaigns_caption {
    padding: 0px 177px 0px;
    font-weight: bold;
    white-space: nowrap;
}