时间戳

首页 > 解决方案 > 带有位置的垂直文本侧边栏：固定

javascript - 带有位置的垂直文本侧边栏：固定

问题描述

       div.row {position: fixed;}
              
              
        
        #vertical {

            -webkit-transform: rotate(90deg);   
            -moz-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            -o-transform: rotate(90deg);
            transform: rotate(90deg);

                  }
<div class="container">
      <div class="row">
            <div class="col-md-10">
                  <p id="testo">
                    Cor is an Italian artist based in Belgium.<br>
                    Cor is both analogic and digital<br>
                    Cor looks towards vernacular, surrealist<br>
                    and pop culture.<br>
                 </p>
           </div>
    
            <div class="col-md-2" id="vertical"> 
      
                    <a class="contact" href="#">Instagram   </a>         
                    <a class="contact" href="#">Email   </a>                       
                    <a class="contact" href="#">Credits   </a>
           
           </div>
  </div>

  </div>

我正在尝试在引导容器（仅包含位置：固定的文本）中插入一个垂直文本旋转的联系人列表（如电子邮件，instagram ecc），该列表必须位于屏幕的右边缘（在容器内，所以位置：固定）但我在定位方面遇到了麻烦，你能帮忙吗？

标签： javascripthtmlcsstwitter-bootstrap

解决方案

您的行需要是 100% 宽度。将此 CSS 添加到您的页面：

.row {
width: 100%;
}

div#vertical {
position: absolute;
top: 85px;
right: -35px;
}

推荐阅读