블록 레벨 요소의 오른쪽 상단에 단추를 추가하십시오.

Question

블록 레벨 요소의 오른쪽 상단에 단추를 어떻게 추가합니까?

<div>some content here</div> 

을 내가있는 블록 바로 옆에, 블록의 오른쪽 상단에있는 버튼을 가지고 포맷 할 방법이 콘텐츠는 "블록"할 수있을 정도로 충분한 길이라고 할 수 있습니다 : 내가 가지고 말할 수 ?

Answer 1

(1) 한 가지 방법은 button을 컨테이너 맨 위에 올리는 것입니다.

<div><button>My Button</button>some content here</div> 

div + button { 
float: right; 
} 

(2) 또 다른 방법은 절대적 div 콘테이너 내의 button를 놓고 (요소 postioned 있도록이 컨테이너에 상대적 절대적 내부)에 div 용기를 위치를 제공하는 것이다. 이렇게하면 버튼이 마크 업의 아무 곳이나 될 수 있습니다. 당신은 패딩이를 조정해야 할 수도 있으므로

div { 
position: relative; 
} 

div button { 
position: absolute; 
top: 0; 
right: 0; 
} 

그러나 버튼은 이제 등

Answer 2

이 절대적으로 위치를 컨테이너 내부에 다른 내용의 상단에있을 것입니다 :

<div style="position: relative;"> 
    some content here 
    <div style="position: absolute; top: 0; right: 0;"><input type="button" value="x" /></div> 
</div>