0

テキストで定義された幅を持ついくつかの DIV と SPAN があります。TOP/LEFT に従って正確な位置を定義する必要があります。ただし、「インラインブロック」オプションでは不可能です。

上/左で正確な位置を設定し、幅で定義されたテキストの幅を維持する方法は?

jsFiddle の例

HTML

<div id="container" style="float: left; margin-right: 10px;">
    <span id="test1">aaa</span>
    <span id="test2">bbb</span>
    <span id="test3">ccc</span>
</div>
<div id="container" style="float: left;">
    <div id="test1">aaa</div>
    <div id="test2">bbb</div>
    <div id="test3">ccc</div>
</div>

CSS

#container {
    width:300px;
    height:300px;
    background-color: #efefef;
}
#test1{
    position: relative;
    top: 100px;
    left: 0px;
    display: inline-block;
}
#test2{
    position: relative;
    top: 0px;
    left: 0px;
    display: inline-block;
}
#test3{
    position: relative;
    top: 0px;
    left: 0px;
    display: block;
}
4

1 に答える 1

1

ラッパーpositionをrelative

#container {
    position: relative;
    ...
}

次に、内側のdivpositionをに設定しますabsolute

#test1 {
    position: absolute;
    ...
}

...
于 2013-08-24T21:08:20.250 に答える