bootstrap 4 : button groups with a.btn in the middle

Question

I have a button group but the middle button is a link so it should b a tag (i can change its button and use js to navigate but I prefer not to ) here is the code

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<div class="btn-group nospiner">
  <button type="button" class="btn btn-warning yekan create-wallet"><i class="mdi mdi-arrow-down-bold"></i> down</button>
  <a href="link.php" type="button" class="btn btn-warning yekan pjax"> center</a>
  <button type="button" class="btn btn-warning yekan ">up  <i class="mdi mdi-arrow-up-bold"></i> </button>
</div>

here is the result

as you can see the middle btn has a border and gradient, how can I change it so it would look like buttons? i've tried adding border:none to all .btn and button group it didn't work

can you please add your code in detail? – KuldipKoradia Sep 28 '19 at 12:50 — KuldipKoradia, Sep 28 '19 at 12:50

score 0 · Accepted Answer · answered Sep 28 '19 at 13:58

Simply remove type=button from the a

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<div class="btn-group nospiner" >
       <button type="button" class="btn btn-warning yekan create-wallet"><i class="mdi mdi-arrow-down-bold"></i> down</button>
       <a  href="link.php"  class="btn btn-warning yekan pjax" > center</a>
       <button type="button" class="btn btn-warning yekan " >up  <i class="mdi mdi-arrow-up-bold"></i> </button>
   </div>

bootstrap 4 : button groups with a.btn in the middle

1 Answers1