Make it non-responsive

[hambern]

I really like Semantic-UI and use it gladly. BUT... I have responsive web-development and I think it's a gimmick and will disappear in a few years. But still.. I like the look and feel of Semantic-UI. So, how do i kill the responsiveness?

[cowwoc]

I think you need to be more specific about what exactly you want to disable.

"Right now when I do X, semantic-ui does Y. I want it to do Z instead".

Disabling responsive designs could mean different things to different people. For example, what do you expect to happen when the browser shrinks horizontally and is too small to contain the nested elements?

[hambern]

Nothing should happen. It should look exactly the same.

[hambern]

If i want to reach things outside the browser i could scroll

[hambern]

I don't ask anyone to permanently make it unresponsive. Just to give is a choice to shut it off

[cowwoc]

If you stick semantic-ui components inside a non-responsive container then the nested components should behave as you asked. By non-responsive, I mean the container should have a fixed width/height.

[jlukic]

I agree that responsiveness as a buzz word is a bit ridiculous, but that being said, you cannot expect all designs to work at all sizes. Just like how a designer might make a highway billboard differently than a cereal box ad. It would be presumptuous to say one design is equally effective at all sizes.

Most elements in Semantic UI require you to use a responsive variation to specify the type of responsiveness: for instance you can use ui stackable grid or ui doubling grid to stack or double grid columns on mobile. This allows you to choose how you want elements to react to a change in browser, or ignore them completely.

The handful that are "out of the box" responsive, like ui table will not appear correctly on mobile sizes without some sort of change in design. Removing responsiveness will make them appear broken.

[Narven]

This was closed, but I have the same issue. I can specify an example. I'm building a desktop app with electron (electron.atom.io). My App is small in size, and that size will never change. If I try to add some code like this:

<div class="ui divided items">
  <div class="item">
    <div class="image">
      <img src="images/electron.ico" width="80px">
    </div>
  </div>
  <div class="item">
    <div class="image">
      <img src="images/electron.ico" width="80px">
    </div>
  </div>
  <div class="item">
    <div class="image">
      <img src="images/electron.ico" width="80px">
    </div>
  </div>
</div>

It automaticly stacks up all images, because it thinks it is in "mobile" mode. But I want to display the items in that list as normal.

Is there any way without messing around with semantic.css to handle this? thanks

[jlukic]

I've opened as a new issue #2901. Responsive first items should all include unstackable variations which allow you to adjust default behavior.

I still think however that elements that are expected to be responsive by default should be, and that non-responsive variations should be 'opt-in'.

[rorysoft]

Where is this Hambern guy now?

[hambern]

I've changed my mind :)