Can you overwrite an inner <div> with a "display: inline"

Issue

Given:

<xyz id="xyz"><div>foobar</div></xyz>

Is there some way, I can assign css properties to xyz, that foobar is displayed in an inline style, rather than in a block?

Solution

Just use display: inline; to make your inner div displayed inline. Check this demo.

#xyz div{
  display: inline;
}

<div id="xyz">
<div>foobar_1</div>
<div>foobar_2</div>
<div>foobar_3</div>
</div>

you may check different kind of CSS display Property

Answered By - Amine KOUIS