Buttons do not maintain top margin when stacking

[otavioserra]

Bug Report

Buttons don't maintain margin top when stacking against each other in responsive layouts.

Steps to reproduce

1. Create a set of at least 6 buttons with the default "ui button" classes.
2. Make the published HTML page window small so that the buttons stack
3. With the buttons stacked, they do not maintain a margin between the elements of a line with the line below.

Expected result

Buttons when stacked on a responsive page are expected to maintain a margin between them as per the https://fomantic-ui.com/elements/button.html#social manual

Actual result

The buttons are not keeping a margin between them and are glued together as if there is no margin between them.

Testcase

https://jsfiddle.net/1bw9mgnL/

Screenshot (if possible)

https://beta.entrey.com.br/files/2021/07/captura-de-tela-2021-07-13-145711.jpg

Version

2.8.8

[lubber-de]

On the docs page this is a custom CSS Setting. You can easily adopt this in your jsfiddle by adding

.segment > .button {
  margin-bottom: 0.75em;
}

See https://jsfiddle.net/lubber/w214at8g/2/

But we cannot add a bottom margin to each button as a default (this would break lots of existing layouts and also some other modules which make use of buttons would break.)
As FUI cannot know how each custom layout looks like, I don't think we can easily fix this without breaking a ton of existing projects.
Thus, this is more of a usage question instead of a bug. Workaround given above 🙂

If your layout has more buttons than a mobile view allows, there is also stackable buttons variation. Looks of course different
https://jsfiddle.net/lubber/w214at8g/4/
https://fomantic-ui.com/elements/button.html#stackable-buttons

[otavioserra]

@lubber-de thank you for your help and thank you for your really nice work with Fomantic-UI. If it helps: I think is better show this type/user on main documantation because I lost a lot of time try to find this option. And only after you showed me this option that I undestand.

OFF-TOPIC: In a short time when I'll finish my platform, I'll present you our platform to sell services using Fomantic-UI as a primary system UI. How can I contact you when it occurs?

[lubber-de]

In a short time when I'll finish my platform, I'll present you our platform to sell services using Fomantic-UI as a primary system UI. How can I contact you when it occurs?

You may post it in the showroom https://github.com/fomantic/Fomantic-UI/discussions/categories/showroom and/or on our Discord Server https://discord.gg/YChxjJ3