Minimum top margin in tabbed examples

[NiedziolkaMichal]

This PR is a fix for #743 and #817.
Problem is that Output Label partically hides the content of examples that don't have "margin-top" property set, on the first element present in example.
When first element is label, table, img or any other element without margin-top, example looks like this:

When margin-top is set, like in element p, example looks fine:

I discussed with wbamberg in #743 to add padding-top to "output", which would move downwards every example, or to remove label altogether. Today I thought to add:

<div class="output-top-margin"></div>

at the very top of "output" element and to create following rule:

.output-top-margin {
  margin-bottom: 10px;
}

This would take advantage of margin collapsing, so p examples would looks exactly the same as they are now, while examples without margin on the top would be moved a bit lower. In this PR I have changed 10px(default margin to p) to 13px, because examples look better that way:

[queengooborg]

I personally think that a simple padding-top: 2rem; is fine. I don't think that there will be many cases where we'll want to collapse the margins; I can only think of ones where margins are added to move the example below the label already, which we should remove anyways. This would also result in simpler code and make our intent slightly clearer.

Would you be down for that?

[github-actions]

This pull request has merge conflicts that must be resolved before it can be merged.

[NiedziolkaMichal]

@queengooborg I have checked examples and indeed padding-top: 2rem; would be fine too. There are 2 interactive examples which will create a scrollbar because of this change, but it's insignificant.

[queengooborg]

Thanks for this, LGTM!