Question

有两个div标签。第一个是从右侧显示20px，另一个是从右侧显示103px，两者都在同一行。

有些时候由于div标签内的文本而被覆盖。文本将根据某些选项而有所不同。它的动态。有时它不会被覆盖，因为文本大小很低。

我希望完成以下方案。

第一个div标签的权利是20 px。第二个div标签右侧需要从第一个div标签的左边缘开始。这可能吗？有谁可以帮助我？

        .second-button {
                font-size: 14px;
                color: #00aeef ;
                position: absolute;
                bottom: 22px;
                right: 103px;
                cursor: pointer;
            }

        .first-button {
                position: absolute;
                right: 20px;
                bottom: 16px;
            }

我目前正在关注上述风格。基于此，任何人都可以提供解决方案吗？

Answer 1

.main-div {
    text-align: right;  
}
.div1 {
    display: inline-block;
    background: #CCC;
}
.div1:last-child {
    margin-left: 20px;
}

<div class="main-div">
  <div class="div1">This is first div</div>
  <div class="div1">This is second div</div>
</div>

Answer 2

对你的两个div添加word-wrap：break-word; css给他们所需的宽度，你应该很棒

Answer 3

我制作了一些代码......可能会帮助你

<div class="abc">First Div</div>
  <div class="abc">Second Div</div>

<style> .abc{float:right; margin-right:20px;}

</style>

Answer 4

试试这个

<style type="text/css">
    #div1{
        margin-left: 20px;
    }
    #div1, #div2{
        display: inline-block;
    }
</style>

<div id="div1">
</div>
<div id="div2">
</div>

右侧的两个div标签互相覆盖

4 个答案: