He logrado con éxito conseguir una<p> seguir a<h> en la misma línea, sin embargo, deseo repetir esto en una nueva línea, pero la siguiente<h> está siguiendo desde el último<p> - ¿Qué tengo que hacer?

He intentado varias opciones "claras", pero ninguna rompe la línea. Realmente no quiero usar<br> o tener un vacío<p>, no demasiado feliz para rodear con<div> ya sea.

Nota - He intentado quitar elinline desde el segundo<h> elemento, y mientras que eso coloca el<h> en una nueva linea, la siguiente<p> termina en su propia nueva línea también.

CSS

.inline {display: inline;}

.newline {clear: left;}

HTML

<h5 class="inline">Heading:</h5>

<p class="inline">Some text.</p>

<h5 class="inline newline">Next Heading:</h5>

<p class="inline">Some more text.</p>

Este es el resultado que quiero lograr:

Título: Algún texto.

Siguiente partida Un poco más de texto.

pero en cambio estoy obteniendo esto:

Título: Algún texto.Siguiente partida Un poco más de texto.

Cualquier sugerencia: tratar de mantener el código tan simple y limpio como sea posible.

[Actualizar]

Por el momento, voy a agregar un div vacío como lo sugiere hafid2com, usando lo siguiente (solo agregando altura para lograr el resultado deseado):

.clear { clear: both; display: block; content: ""; width: 100%; }

<div class="clear"></div>

Como se muestra en el violín:http://jsfiddle.net/rxAnk/5/