Text inside <p> after line break <br> ignores css for <p> tag if heading is also present

My goal is to have headings be inline with the text inside of a <p> tag... all of which have a margin to the padding of the container

I have the following html code

<div id='homeContent'>
  <!-- other headings and content here -->

  <p><h3>Heading</h3> some text</br> more text</p>

  <!-- other headings and content here -->
</div>

with the following CSS

#homeContent h3, #homeContent h4, #homeContent p {
  z-index: 0;
  margin: 0px 16px;
  padding-top: 8px;
}

#homeContent h3, #homeContent h4 {
  display: inline;
}
#homeContent {
  padding: 0px 16px;
  margin: 32px 0px;
}

Here is what I want to happen (considering the code block to be the container border)

      H3 HEADING some text
      more text here

Here is what I'm actually getting

      H3 HEADING some text
  more text here <-- notice here the text does not respect the margin given to the <p> tag

Now if I take the heading tag out of the paragraph tag, the paragraph text behaves correctly, but obviously does not appear inline with the heading, which is the goal.