Question

我有一个当前位于屏幕左侧的标签。我想做的是将它移到右侧并将其向上移动一些。我将发布我在左侧的内容：

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>

Answer 1

试试这个：

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

另外，在我看来，不知道这个元素的父母可能难以得到答案。

Answer 2

我认为这就是你想要的。

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);
    }

AND HTML：

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

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

2 个答案: