How to set an button align-right with Bootstrap

Question

I am learning Bootstrap  The structure is a container within some context  At the bottom of the container  I put a button next to an description   Now  I want to set the button align to the right without break the bootstrap structure  What should I do  I had set the  float right  to the button style  but it appeared bad  The button is outside the  alert-info  background and not vertical align  Any better method    lt div class  alert alert-info  gt   lt a href     class  alert-link  gt Summary Its some description       testtesttest lt  a gt     lt button type  button  class  btn btn-primary btn-lg  style  float right   gt Large      button lt  button gt    lt  div gt

User · Answer

This work for me in bootstrap 4       lt div class  quot alert alert-info quot  gt         lt a href  quot   quot  class  quot alert-link quot  gt Summary Its some description       testtesttest lt  a gt           lt button type  quot button quot  class  quot btn btn-primary btn-lg float-right quot  gt Large button lt  button gt       lt  div gt

User · Answer

Try this    lt div class  row  gt   lt div class  alert alert-info  style  min-height 100px   gt       lt div class  col-xs-9  gt           lt a href     class  alert-link  gt Summary Its some            description       testtesttest lt  a gt         lt  div gt       lt div class  col-xs-3  gt           lt button type  button  class  btn btn-primary btn-lg  gt Large      button lt  button gt       lt  div gt    lt  div gt   lt  div gt    Demo   http   jsfiddle net Hx6Sx 1

User · Answer

lt div class  container  gt       lt div class  btn-block pull-right  gt           lt a href     class  btn btn-primary pull-right  gt Search lt  a gt           lt a href     class  btn btn-primary pull-right  gt Apple lt  a gt           lt a href     class  btn btn-primary pull-right  gt Sony lt  a gt       lt  div gt   lt  div gt

User · Answer

This worked for me   lt div class  quot text-right quot  gt       lt button type  quot button quot  gt Button 1 lt  button gt       lt button type  quot button quot  gt Button 2 lt  button gt   lt  div gt

User · Answer

function Continue  show  onContinue       return  lt div className  row continue  gt      show    lt div className  col-11  gt       lt button class  btn btn-primary btn-lg float-right  onClick   onContinue  gt Continue lt  button gt       lt  div gt        null      lt  div gt

User · Answer

UPDATE  For Bootstrap 5 The class name is now  quot float-end quot  instead of  quot pull-right quot   lt div class  quot alert alert-info clearfix quot  gt       lt a href  quot   quot  class  quot alert-link quot  gt        Summary Its some description       testtesttest      lt  a gt        lt button type  quot button quot  class  quot btn btn-primary btn-lg float-end quot  gt        Large button      lt  button gt   lt  div gt   For Bootstrap 4 and under Just add a simple pull-right class to the button  and make sure the container div is clearfixed   lt div class  quot alert alert-info clearfix quot  gt       lt a href  quot   quot  class  quot alert-link quot  gt        Summary Its some description       testtesttest      lt  a gt        lt button type  quot button quot  class  quot btn btn-primary btn-lg pull-right quot  gt        Large button      lt  button gt   lt  div gt

[css] How to set an button align-right with Bootstrap?

Examples related to css

Examples related to twitter-bootstrap