potraitでボタンを回転させる方法は？

Question

ブートストラップボタンをポートレートモードで回転します。私はposition:absoluteボタンを使用して試してみました。ここで

ボタンのフィドル

Fiddle

が回転するときに、それがどのように見えるかを確認されています

Fiddle

いくつかのポイント：

1. 方向変更が回転しないため、方向変更のメディアクエリが機能しません。

2. 画面の解像度は動的なので、静的な幅、高さ、余白の上端または下端は機能しません。

3. 垂直方向の回転は、ボタンの垂直方向のビューを意味します。

Answer 1

あなたはtransform:rotate

.btnSelection { 
 
    transform: rotate(90deg); 
 
    margin-top: 100px 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="container-fluid" id="conditional_div"> 
 
    <div class="row"> 
 
    <div class="col-sm-3 pull-right"> 
 
     <div class="btnSelection"> 
 
     <button type="button" class="btn btn-primary conditional_playlist">Test</button> 
 
     <button type="button" class="btn btn-primary conditional_playlist">Test1</button> 
 
     <button type="button" class="btn btn-primary conditional_playlist">Test2</button> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>