[Tab] Fix the justify content when there is only one child

[oliviertassinari]

• PR has tests / docs demo, and is linted.
• Commit and PR titles begin with [ComponentName], and are in imperative form: "[Component] Fix leaky abstraction".
• Description explains the issue / use-case resolved, and auto-closes the related issue(s) (http://tr.im/vFqem).

We shouldn't be using justifyContent: 'space-between' when there is only one child. As we can see here, the element is rendered at the top.
I'm using justifyContent: 'center' instead and I'm added a margin to have a fine control of the spacing.

[nathanmarks]

@oliviertassinari would space-around make more sense for the default in this situation?

[oliviertassinari]

@nathanmarks Well, let me try with space-around.

[oliviertassinari]

@nathanmarks You are going to like this much better (I do at least). I'm using center now.

[oliviertassinari]

72 and 48 are the official height.

[nathanmarks]

@oliviertassinari even better -- there's no reason not to create the margin in between them with the spec numbers. The flex spreading is unpredictable.

[oliviertassinari]

there's no reason not to create the margin in between them with the spec numbers.

Indeed, it's already done ;).