@VokERton

Как центрировать кнопку по вертикали, относительно области просмотра в браузере?

Доброго времени.

Пытаюсь центрировать кнопку по вертикали, относительно области просмотра в браузере.

Код боковой кнопки:

<style>
 #order {
 position: fixed; 
 right: 0;
 top: 0; 
 }
 .rotated {
 writing-mode: tb-rl;
 transform: rotate(-180deg);
 }
</style>
<p class="buttond;" data-options="right, slide-down,size32,eachCounter1,eachCounter-right,counter0,upArrow-right;"><a class="rotated" target="_self" style="letter-spacing: 0.2em; cursor: pointer; font-size:15.4px; text-decoration: none; padding:15px 20px; color:#ffffff; background-color:#498BFA; border-radius:0px; border: 0px solid #ffffff;" onmouseover="this.style.backgroundColor='#7BABFB';" onmouseout="this.style.backgroundColor='#498BFA';" href="javascript:;" onclick="openchat();" id="order" letter-spacing: 0.2em;>ЗАКАЗ в 1 КЛИК</a></p>
<script type="text/javascript">function openchat(){new _uWnd('chat','Заказ в 1 клик',500,100,{align:0,shadow:0,close:1,autosize:1,maxh:600,minh:100,modal:1,resize:0,nomove:1}, $("#chat").html() )}</script> 
<div style="display:none;" id="chat">$MFORM_3$</div>


Прошу подсказки...
  • Вопрос задан
  • 39 просмотров
Решения вопроса 1
@VokERton Автор вопроса
Всем огромное, спасибо. Вопрос закрыт. Доработал с учетом ваших комментариев.

Вот что получилось:

<style>
 #order {
 position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
 }
 .rotated {
 writing-mode: tb-rl;
 transform: rotate(-180deg);
 }
</style>
<p class="buttond;" data-options="right, slide-down,size32,eachCounter1,eachCounter-right,counter0,upArrow-right;"><a class="rotated" target="_self" style="letter-spacing: 0.2em; cursor: pointer; font-size:15.4px; text-decoration: none; padding:15px 20px; color:#ffffff; background-color:#498BFA; border-radius:0px; border: 0px solid #ffffff;" onmouseover="this.style.backgroundColor='#7BABFB';" onmouseout="this.style.backgroundColor='#498BFA';" href="javascript:;" onclick="openchat();" id="order" letter-spacing: 0.2em;>ЗАКАЗ в 1 КЛИК</a></p>
<script type="text/javascript">function openchat(){new _uWnd('chat','Заказ в 1 клик',500,100,{align:0,shadow:0,close:1,autosize:1,maxh:600,minh:100,modal:1,resize:0,nomove:1}, $("#chat").html() )}</script> 
<div style="display:none;" id="chat">$MFORM_3$</div>
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Можно так, будет всегда по середине по вертикали
.button {
  position: fixed;
  top: 0;
  bottom: 0;
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы