Box padding – text stays in the same place

Hi,

I recently started to create my own template. I have a problem though, I wanted to put a box before the title with number of comments inside it.

Here is the code:
https://jsfiddle.net/SEEdY/1/

I unfortunatelly had to enter padding: padding-top: 5px; because the box was under the title on the screen.

The box is now on the same level as the title, but the text is still in the same place.
https://imgur.com/F03wbXw

How to make it work? Everything is in <h2> tag in the .php file (I moved comments code there, if I put it outside <h2> tag it comes above the title).