css - 新しい行に印刷するインライン要素

Question

次のコードがあります。

<div class="outsideDiv">
    <div class="element1">Name: </div>
    <div class="element2">Something</div>
    <div class="element3"> - </div>
    <div class="element4">This something is great</div>
</div>

外側の div は display:block で、内側の div はすべて display:inline です。ブラウザでは、次のようにすべて同じ行に表示されます。

Name: Something - This something is great

印刷すると、4 つの div が次のように別々の行に表示されます。

Name: 
Something
-
This something is great

4 つの内部 div を同じ行に印刷する方法を理解するのに苦労しています。

Answer 1

<div class="outsideDiv">
    <div class="element1" style="display:inline">Name: </div>
    <div class="element2" style="display:inline">Something</div>
    <div class="element3" style="display:inline"> - </div>
    <div class="element4" style="display:inline">This something is great</div>
</div>

また

これをprint.cssに書きます：

.element1,.element2, .element3, .element4 {display: inline;}