Button Group
Horizontal
<div class="btn-group" role="group" aria-label="Basic example"><button type="button" class="btn btn-secondary">Left</button><button type="button" class="btn btn-secondary">Middle</button><button type="button" class="btn btn-secondary">Right</button></div>
Input Group
@
<div class="btn-toolbar justify-content-between mr-2" role="toolbar" aria-label="Toolbar with button groups"><div class="btn-group mb-2" role="group" aria-label="First group"><button type="button" class="btn btn-secondary">1</button><button type="button" class="btn btn-secondary">2</button><button type="button" class="btn btn-secondary">3</button><button type="button" class="btn btn-secondary">4</button></div><div class="input-group mb-2"><div class="input-group-prepend"><div class="input-group-text" id="btnGroupAddon2">@</div></div><input type="text" class="form-control" placeholder="Input group example" aria-label="Input group example" aria-describedby="btnGroupAddon2"></div></div>
Vertical
<div class="btn-group-vertical" role="group" aria-label="Vertical button group"><button type="button" class="btn btn-secondary">Button</button><div class="btn-group" role="group"><button id="btnGroupVerticalDrop1" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown <svg>... </svg></button><div class="dropdown-menu" aria-labelledby="btnGroupVerticalDrop1"><a class="dropdown-item" href="#">Dropdown link</a><a class="dropdown-item" href="#">Dropdown link</a></div></div><button type="button" class="btn btn-secondary">Button</button><button type="button" class="btn btn-secondary">Button</button><div class="btn-group" role="group"><button id="btnGroupVerticalDrop2" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown <svg>... </svg></button><div class="dropdown-menu" aria-labelledby="btnGroupVerticalDrop2"><a class="dropdown-item" href="#">Dropdown link</a><a class="dropdown-item" href="#">Dropdown link</a></div></div></div>
Copyright © 2020 DesignReset,All Rights Reserved.
Coded with