Search code examples
cssreactjssemantic-ui

Semantic UI React - floated button coming out of its container?


I'm using Semantic UI React. I have a Segment component with a few things inside, ending with a Button that I want to float right, but when I float it right it starts coming out of the Segment:

floated button is outside segment

If I don't float it, it stays inside the Segment nicely, but it's on the left, and I want it on the right:

enter image description here

What can I do to fix this?


Solution

  • Instead of float, try using margin-left:auto. This will align a block level element on the right of its container.