CODEWITHSUNDEEP
cssreactjssemantic-ui
preston
preston

Reputation: 4337

Semantic-UI container gets margins automatically at certain breakpoints

I'm using Semantic-UI with React JS.

This is my top-most html:

<head>
  <title>Title</title>
</head>

<body>
  <div id="render-target" class="ui fluid container"></div>
</body>

As you can see I am using a fluid ui container, which means I want the container to be as wide as the browser.... This works at a bigger browser size. However, for some reason, if I reduce the size of the browser, at a certain breakpoint the container gets some margin on both sides automatically.

What is the reason for this and how do I fix this so that it always is as wide as the browser?

Thank you very much.

Upvotes: 0

Views: 4826

Answers (1)

preston
preston

Reputation: 4337

.ui.fluid.container {
    margin-left: 0 !important;
    margin-right: 0 !important;

}

This made it work for me....

Upvotes: 1

Related Questions