Создать вертикальную панель кнопок - PullRequest
Новая
       38

Создать вертикальную панель кнопок

0 голосов
/ 30 августа 2018

Я создал вертикальную кнопку, которая придерживается правой стороны экрана, но проблема в том, что кнопка не реагирует, есть способ заставить кнопку реагировать. Я использую бутстрап 3 Вот пример кода для кнопок.

HTML

Редактировать

У меня есть планировщик кендо Я пытаюсь выровнять кнопки по правой стороне этого планировщика кендо 

  <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-left: -1%;">
    <div kendo-tooltip k-content="vm.theContent" k-filter="'.k-event'" class="k-group" style="background:white;border-top: 2px solid #b1b1b1;">
      <div id="scheduler" kendo-scheduler="vm.scheduler" k-options="vm.schedulerOptions" k-rebind="vm.schedulerOptions">
         <!--something--->
      </div>
    </div>
  </div>

<div class="col-lg-offset-11 col-lg-1 col-md-1 col-sm-1 col-xs-1 vertical-bar" >
   <button class="btn btn-info btn-sm vertical-btns">
     <i class="fa fa-angle-double-up" style="font-size:24px;"></i>
    </button><br>

    <button class="btn btn-info btn-sm vertical-btns">
     <i class="fa fa- angle-double-down" style="font-size:24px;" ></i> 
    </button> 
</div>

CSS 

.vertical-bar{
  top: 36.6%;
}

.vertical-btns{
  padding: 11px 10px    !important;
  line-height: 17.6em   !important;
}

1 Ответ

0 голосов
/ 30 августа 2018

Вы можете использовать класс начальной загрузки btn-group-vertical следующим образом: 

 <div class="btn-group-vertical">
      <div class="col-lg-offset-11 col-lg-1 col-md-1 col-sm-1 col-xs-1 vertical-bar" >
    <button class="btn btn-info btn-sm">
     <i class="fa fa-angle-double-up" style="font-size:24px;"></i>
    </button><br>

    <button class="btn btn-info btn-sm">
     <i class="fa fa- angle-double-down" style="font-size:24px;" ></i> 
    </button> 
</div>
    </div>
...