CODEWITHSUNDEEP
csstwitter-bootstrap
Paolo Rossi
Paolo Rossi

Reputation: 2510

bootstrap toggle with width 100%

I'm using bootstrap toggle plugin link and I'd like to know how can set the width 100% like btn-block to occupy the all space of the parent element. Now I can set the with only with px value. 

$('.toggle').bootstrapToggle({
    on: 'Y',
    off: 'N',
    width: ONLY FIXED SIZE IN PX,
    size: 'small'
});

I tried to create a custom class for this but without success.

<div class="row">
    <div class="col-md-2">
        <input type="checkbox" class="toggle" name="cb1" value="1">
    </div>
    <div class="col-md-3">
        <input type="checkbox" class="toggle" name="cb2" value="1">
    </div>
    <div class="col-md-4">
        <input type="checkbox" class="toggle" name="cb3" value="1">
    </div>
</div>

How could I do? Thank you

Upvotes: 3

Views: 13364

Answers (1)

Nikhil Nanjappa
Nikhil Nanjappa

Reputation: 6632

You can directly give the width in % metrics as well and not just fixed px. So you can change the code to make it look like this.

$('.toggle').bootstrapToggle({
    on: 'Y',
    off: 'N',
    width: '100%',
    size: 'small'
});

Alternatively you can remove the width parameter from the .bootstrapToggle() method and use it in the HTML as well like so.

<input type="checkbox" class="toggle" name="cb1" value="1" data-width="100%">

Upvotes: 14

Related Questions