将页面左侧的标签页移动到右侧

问题描述:

我有一个当前位于屏幕左侧的选项卡。我想要做的是将其移到右侧,并将其向上移动一些。我会后我有什么它位于左侧:将页面左侧的标签页移动到右侧

CSS

#feedback { 
     position: fixed; 
     left: 0; 
     bottom: 0; 
     height: 250px; 
     margin-left: -3px; 
     margin-bottom: -3px; 
    } 

    #feedback-tab { 
     float: right; 
     color: #fff; 
     font-size: 20px; 
     cursor: pointer; 
     text-align: center; 
     width: 120px; 
     height: 42px; 
     background-color: rgba(0,0,0,0.5); 
     margin-top: 60px; 
     margin-left: -42px; 
     padding-top: 5px; 
     -moz-border-radius: 3px; 
     -webkit-border-radius: 3px; 
     border-radius: 3px; 
     -webkit-transform: rotate(90deg); 
     -moz-transform: rotate(90deg); 
     -ms-transform: rotate(90deg); 
     -o-transform: rotate(90deg); 
     transform: rotate(90deg); 
    } 

    #feedback-tab:hover { 
     background-color: rgba(0,0,0,0.4); 
    } 

HTML

<div id="feedback"> 
    <div id="feedback-tab">Feedback</div> 
</div> 
+0

您可以添加JSBin或链接的jsfiddle? – Zac

+0

https://jsfiddle.net/89fjamf8/ –

我认为这是你想要的。

CSS:

#feedback { 
     position: fixed; 
     right: 0; 
     bottom: 150px; 
     height: 250px; 
     margin-left: -3px; 
     margin-bottom: -3px; 
    } 

    #feedback-tab { 
     float: right; 
     color: #fff; 
     font-size: 20px; 
     cursor: pointer; 
     text-align: center; 
     width: 120px; 
     height: 42px; 
     background-color: rgba(0,0,0,0.5); 
     margin-top: 60px; 
     margin-right: -42px; 
     padding-top: 5px; 
     -moz-border-radius: 3px; 
     -webkit-border-radius: 3px; 
     border-radius: 3px; 
     -webkit-transform: rotate(-90deg); 
     -moz-transform: rotate(-90deg); 
     -ms-transform: rotate(-90deg); 
     -o-transform: rotate(-90deg); 
     transform: rotate(-90deg); 
    } 

    #feedback-tab:hover { 
     background-color: rgba(0,0,0,0.4); 
    } 

和HTML:

<div id="feedback"> 
    <div id="feedback-tab">Feedback</div> 
</div> 

试试这个:

#feedback { 
      position: absolute; 
      right: 0; 
      bottom: 0; 
      height: 250px; 
      margin-right: -3px; 
      margin-bottom: -3px; 
     } 

而且,不知道这个元素的父母在我看来,nt很难回答。