Question

请您告诉我如何在一行中显示时间和消息？

我希望输出必须

时间空间消息此处（全部在一行中）

这是我的代码

<div class="mdv">
<a href="/tips/"><div class="hed1 nav1" style="color:#333;border-radius:4px 4px 0 0">Latest Share Tips</div></a>
                <a href="/tips/437373-buy-tata-communications-ltd-ta/" class="c1">
                <div class="stoc5 mt1">
                        <div class="fl c2 f14 ti-s mt">5 hours</div>
                        <div class="c1 fl wi80">(Period - Intraday) - Buy Tata Communications Ltd - Target price 433.00</div>
                        <div class="fr c2 f14 ti-s1 mt"></div>
                        <div class="cl"></div>
                </div>
        </a>
                <a href="/tips/437372-buy-bharti-airtel-ltd-bhartiar/" class="c1">
                <div class="stoc5 mt1">
                        <div class="fl c2 f14 ti-s mt">6 hours</div>
                        <div class="c1 fl wi80">(Period - Intraday) - Buy Bharti Airtel Ltd - Target price 332.25</div>
                        <div class="fr c2 f14 ti-s1 mt"></div>
                        <div class="cl"></div>
                </div>
        </a>
                <a href="/tips/437371-buy-pipavav-defence-offshore-e/" class="c1">
                <div class="stoc5 mt1">
                        <div class="fl c2 f14 ti-s mt">6 hours</div>
                        <div class="c1 fl wi80">(Period - Intraday) - Buy Pipavav Defence &amp; Offshore Engineering Company Ltd - Target price 89.60</div>
                        <div class="fr c2 f14 ti-s1 mt"></div>
                        <div class="cl"></div>
                </div>
        </a>
                <a href="/tips/437370-buy-praj-industries-ltd-prajin/" class="c1">
                <div class="stoc5 mt1">
                        <div class="fl c2 f14 ti-s mt">6 hours</div>
                        <div class="c1 fl wi80">(Period - Long term) - Buy Praj Industries Ltd - Target price 150.00</div>
                        <div class="fr c2 f14 ti-s1 mt"></div>
                        <div class="cl"></div>
                </div>
        </a>
                <a href="/tips/437369-sell-acc-ltd-acc-at-1-354-00-f/" class="c1">
                <div class="stoc5 mt1">
                        <div class="fl c2 f14 ti-s mt">6 hours</div>
                        <div class="c1 fl wi80">(Period - Intraday) - Sell ACC Ltd - Target price 1,330.00</div>
                        <div class="fr c2 f14 ti-s1 mt"></div>
                        <div class="cl"></div>
                </div>
        </a>
<div class="cl"></div>
</div>

这是我的小提琴

https://jsfiddle.net/pL7xugg1/5/

Answer 1

您需要.mt1容器中的inline来显示block而不是.mt1 > div { display: inline; }，所以这样的事情会有效：

div

小提琴：https://jsfiddle.net/pL7xugg1/9/

另一种方法是将您的所有内容放在一个div内，因为它看起来不像您正在使用其他4个p或{{1} }或span。

我使用4个div的假设就是你希望为每个div，布局，着色等执行特定的操作，如果你能提供更多的上下文，答案可以更新。

Answer 2

您可以使用例如：

<div class="stoc5 mt1" style="display: inline-flex;">

Answer 3

使用<span></span>标记在另一个元素旁边放置一个元素。或使用display:inline-block; CSS获得相同的结果：

DEMO

如何在一行中显示Time Div和Message div？

3 个答案: