Установить положение кнопок при изменении размера страницы

Question

У меня есть этот html код, который я использую с Bootstrap:

<div class="cell-xs-10 cell-md-6">
  <div>
    <div class="text-center offset-top-20">
       <input id="buy" type="submit" class="btn btn-primary">
       <input id="buy" type="sell" class="btn btn-primary">
    </di>
  <div>
<div>

Когда я изменяю размер веб-страницы и уменьшаю ширину, кнопки перемещаются, а вторая становится ниже первой. Есть ли способ сохранить их положение и держать их горизонтально?

Answer 1

Вы можете попробовать использовать CSS свойства на уровне элемента, чтобы обеспечить фиксированное положение кнопки. как

<input id="buy" style="position : absolute;" type="submit" class="btn btn-primary">
<input id="buy" style="position : absolute;" type="sell" class="btn btn-primary">

или на уровне класса, как

btn-primary {
     position : absolute;
}

Answer 2

Если ширина элемента контейнера недостаточна для обеих кнопок, это невозможно. Попробуйте увеличить ширину элемента контейнера для экранов меньшего размера с помощью медиазапроса, если размер экрана позволяет это сделать.