绝对位置还是其他什么？

Question

您好，我想实现以下目标：

以下代码有效，但我不确定左上角“名称”的位置：绝对是明智的做法，还是应该使用 float ？

这是 html

    <div class="bodyframe">
        <div class="upperbodyframe">   
            <div id="leftupperbodyframe">Name</div>
            <div id="rightupperbodyframe">Name 2 Name 3</div>

        </div>

css

![.bodyframe {

}
.upperbodyframe{


}

#leftupperbodyframe{

   text-align:left;
   border: 1px solid ;
    position: absolute;
}
#rightupperbodyframe{
    text-align: right;

    }]

Answer 1

您可以使用两种方法执行此操作。

第一种方法

.upperbodyframe{
    width:100%;
    position:absolute;
}
#leftupperbodyframe{
    position: absolute;
    left:0px;
}
#rightupperbodyframe{
    position: absolute;
    right:0px;
}
.clear{
    clear:both;
}
 <div class="upperbodyframe">   
            <div id="leftupperbodyframe">Name</div>
            <div id="rightupperbodyframe">Name 2 Name 3</div>
        </div>

第二种方法

.upperbodyframe{
    width:100%;
}
#leftupperbodyframe{
    float:left;
}
#rightupperbodyframe{
    float:right;
}
.clear{
    clear:both;
}
 <div class="upperbodyframe">   
            <div id="leftupperbodyframe">Name</div>
            <div id="rightupperbodyframe">Name 2 Name 3</div>
        </div>

谢谢Arun Krishnan

Answer 2

我会在这里使用花车。这个职位真的没有理由：绝对也是这样。

.upperbodyframe {overflow:hidden} /* or div will collapse with only floated elements inside */
#leftupperbodyframe {float:left; border: 1px solid ;}
#rightupperbodyframe {float:right;}