Left Right float button inside div

Question

How can I make button float only in div area   Here is my example CSS and HTML    x000D   x000D   test   x000D    width  60   x000D    display  inline  x000D    overflow  auto  x000D    white-space  nowrap  x000D    margin  0px auto  x000D    x000D   lt div class  test  gt  x000D     lt div style  float  left   gt  x000D       lt button gt test lt  button gt  x000D     lt  div gt  x000D     lt div style  float  right   gt  x000D       lt button gt test lt  button gt  x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   x000D    I want it to be like this

User · Accepted Answer

Change display inline to display inline-block   test     width 200px    display inline-block    overflow  auto    white-space  nowrap    margin 0px auto    border 1px red solid

User · Answer

You can use justify-content  space-between in  test like so    x000D   x000D   test   x000D    display  flex  x000D    justify-content  space-between  x000D    width  20rem  x000D    border   1rem red solid  x000D    x000D   lt div class  test  gt  x000D     lt button gt test lt  button gt  x000D     lt button gt test lt  button gt  x000D   lt  div gt  x000D   x000D   x000D      For those who want to use Bootstrap 4 can use justify-content-between    x000D   x000D  div   x000D    width  20rem  x000D    border   1rem red solid  x000D    x000D   lt link href  https   stackpath bootstrapcdn com bootstrap 4 4 1 css bootstrap min css  rel  stylesheet    gt  x000D   lt div class  d-flex justify-content-between  gt  x000D     lt button gt test lt  button gt  x000D     lt button gt test lt  button gt  x000D   lt  div gt  x000D   x000D   x000D

[css] Left/Right float button inside div

Examples related to css

Examples related to html