Semantic-ui: Responsive visibility class?

[Emusp]

Why do you have to add the class grid before it works?

<div class="ui top fixed menu mobile only grid">
Works and display only on mobile, but changes button margin on menu, and other tings like tables.

<div class="ui top fixed menu mobile only">
Does not work.

The documentation is not very clear on this point. And it does not make logic sense why you have do add a grid class to make it work.

[awgv]

@Emusp What’s the context, where is it in the documentation?

[Emusp]

https://semantic-ui.com/elements/container.html

Eg. If I what to display a table in tablet computer only, but maybe a different layout in mobile only view.
If I display a table inside a <div class="ui container computer only grid">
The table will change styling because of the grid class.

[awgv]

@Emusp Because those classes exist only for the grid component. Somebody asked about the container a week or so ago, and I proposed a change here Semantic-Org/Semantic-UI-Docs#316 to remove that row, because it seems to be confusing some people on that particular page that you linked, and without that row, a developer will only encounter [device] only classes on the grid component’s page.

If you need something to use device visibility outside of the grid component, you’ll have to use set up custom media queries. If you’d like to know how to work with the framework’s source to do that, please let me know.

[Emusp]

Ok, thanks for the clarification.

Will make my own media queries then.
But I think it will make sense have the option to use device visibility classes on containers also.

[bitfede]

Absolutely!!!!! These [ https://materializecss.com/helpers.html#hiding ] are a MUST HAVE!!!

A bit disappointing not seeing them in Semantic....