css - inline elements printing on new line -

i have following code:

<div class="outsidediv">     <div class="element1">name: </div>     <div class="element2">something</div>     <div class="element3"> - </div>     <div class="element4">this great</div> </div> 

the outer div display:block , of inside divs display:inline. in browser shows on same line this:

name: - great 

when go print it, 4 divs show on seperate lines this:

name:  - great 

i having hard time figuring out how 4 inside divs print on same line.

<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 great</div> </div> 

or

write print.css:

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