html - Inline form with flex, bug in safari -
i create simple inline form flex. in safari found bug - button lose width, here screenshot:
how fix bug in safari ? ps: can`t set fixed width on button.
here code:
<div class="container"> <div class="row"> <div class="col-md-3"> <form action="" class="form-inline-flex"> <div> <input type="text" /> </div> <button type="submit" />subscribe</button> </form> </div> </div> </div> .form-inline-flex{ display: -ms-flexbox; display: -webkit-flex ; display: flex; } button{ display:inline-block; padding: 13px 28px; font-weight: 700; text-align: center; cursor: pointer; border: 1px solid transparent; padding: 13px 20px; font-size: 16px; line-height: 1.375; } input{ display: block; width: 100%; font-size: 14px; padding: 7px 18px; line-height: 34px; color: #000; border: 1px solid #d2d1d1; }
Comments
Post a Comment