Menu
I need segment with text(inside <p> ), and button on next row on the right
I try next markup, but it seems not working properly( button overflow segment border):
<div class="ui container">
<div class=" ui segment">
<p> Some Text.</p>
<button class="ui right floated primary button"> Some Action</button>
</div>
</div>
How to do it, using semantic-ui framework?
393
To change the text alignment of the semantic UI card, we use the “center/left/right aligned” class in the section of the card where we want the alignment.
If you want to move the button to the right, you can also place the button within a <div> element and add the text-align property with its "right" value to the "align-right" class of the <div>.
“Align Button Right means that we set the button to the right side of the page. Alignment is something about the adjustment of the text or button at different positions. It describes the position of our text and buttons, whether we want to align our text or button to the right of the page or the left or center.
A button indicates a possible user action. Semantic UI provides an easy-to-use syntax that simplifies not only the styling of a button, but also the natural language semantics.
I found an answer:
In addition to using right floated on the button, also change the segment class from ui segment to ui clearing segment.
62
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
