html - 右上のポジショニング要素

Question

div、テキスト、ボタンを含むフィドルがあります。

divのサイズや、div内のテキストの量に関係なく、divの右上にボタンを配置したいと思います。

私は

float: right;
position: relative;

トリックを行うかもしれませんが、divの「テキスト」がボタンを押し下げるため、これは機能しません。

これを行うためのより良い方法はありますか？たぶん、ボタンを？absoluteではなく右上に配置します。relative

score 4 · Accepted Answer

絶対測位を使用する場合は、とを使用して、右上隅を基準にしてボタンを配置できtopますright。

#myButton {
    position: absolute;
    top: 0;
    right: 0;
}

絶対位置にある場合、要素はフローから取り出されるため、他の要素（<p>そこにあるような）が十分に大きい場合は、その「下」に入る可能性があることに注意してください。

score 1 · Accepted Answer

あなたが欲しいのは絶対的なポジショニングだと思うので、それを試してみてください

position: absolute;
top: 0;
right: 0;

score 1 · Accepted Answer

ボタンのスタイルを次のように変更しました

#myButton {
    cursor: pointer;
    position: absolute;
    top:5px; 
    right: 5px;    
}

これはあなたが探しているものですか？

3 に答える 3