bootstrap button: Stretch to fill its container space

66,161

Have you tried btn-block?

<a class="btn btn-default btn-block"></a>

And try width:100% on

<div class="btn-group" style="width:100%">
Share:
66,161
Murhaf Sousli
Author by

Murhaf Sousli

Updated on July 09, 2022

Comments

  • Murhaf Sousli
    Murhaf Sousli almost 2 years

    I'm using bootstrap buttons, I would like to stretch the dropdown button in the middle to fill the rest of the toolbar space.

    enter image description here

    HTML (shortened code):

    <div class="gallery-toolbar">
        <ul style="padding:0">
       <li><a>Back</a></li>
    
       <li id="gallery_title">
       <div class="btn-group">
         <a class="btn btn-default"><?php echo $gallery->title ?></a>
         <a class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
         <ul class="dropdown-menu">some php</ul>
       </div></li>
    
      <li><a>Slideshow</a></li>
    

    css:

    .gallery-toolbar li { list-style:none; display: inline }
    .gallery-toolbar li:last-child { float:right }
    #gallery-title { ?? }
    

    I have tried the class "btn-group-jastified" but it didn't work at all.

    any ideas?