jquery - Bootstrap Button Collapse to second line -
i wondering if there way buttons automatically grow vertically display entire label rather cut off using bootstrap , font awesome.
code:
<div class="well well-sm"> <p><h5 style="underline"><u>social media:</u></h5></p> <p> <a href="" class="btn btn-block btn-social btn-facebook" target="_blank"> <i class="fa fa-facebook"></i> <font size="2"> on facebook</font> </a> <a href="" class="btn btn-block btn-social btn-twitter" target="_blank"> <i class="fa fa-twitter"></i> <font size="2"> follow on twitter</font> </a> <a href="" class="btn btn-block btn-social btn-pinterest" target="_blank"> <span class="fa fa-youtube-play"></span> <font size="2"> watch on youtube</font> </a> </p> </div>
current output:
____small screen_____________large screen
... large screen want small screen buttons have output like:
like on <-first line
facebook <-second line
definitely, answer above(by ryan) work word-wrap: break-word;
highlights bootstrap.
bootstrap tend have hidden css.
especially one: overflow: hidden;
doesn't make work-wrap work!
lastly, try inspect
website in order see happening code.
hope address issue!
Comments
Post a Comment