CSS for display-test3

  <script>
    html  { background-color: red; }  # 0,0,0,1
     html *  { padding 5px; }  # 0,0,0,1
     body  { background-color: gray; margin: 10px; border: 2px black solid; width: 450px; }  # 0,0,0,1
     .inl  { display: inline; width: 200px; }  # 0,0,1,0
     .blk  { display: block; width: 200px; }  # 0,0,1,0
  </script>
  

Page Content

<h3>Wrapping Paragraphs in div's with 'display: inline'</h3>
<div class="inl">
 <p class="blk" style="background-color: blue;">paragraph 1 is 'display:block;' and various other texts.  with more filler: blagh blagh blagh blah</p>
 <p class="blk" style="background-color: green;">paragraph 2 is 'display: block;' and various other texts.  with more filler: blagh blagh blagh blah</p>
</div>
<div class="inl">
 <p class="blk" style="background-color: yellow;">paragraph 3 is 'display:block;' and various other texts.  with more filler: blagh blagh blagh blah</p>
 <p class="blk" style="background-color: brown;">paragraph 4 is 'display: block;' and various other texts.  with more filler: blagh blagh blagh blah</p>
</div>

  

Wrapping Paragraphs in div's with 'display: inline'

paragraph 1 is 'display:block;' and various other texts. with more filler: blagh blagh blagh blah

paragraph 2 is 'display: block;' and various other texts. with more filler: blagh blagh blagh blah

paragraph 3 is 'display:block;' and various other texts. with more filler: blagh blagh blagh blah

paragraph 4 is 'display: block;' and various other texts. with more filler: blagh blagh blagh blah