부동 <button> 객체

Question

은 내가 <div> 포함 <button> 개체를 오른쪽 (float: right;), 객체가 떴다 때 는하지만 그들은 unclickable 될 플로트하기 위해 노력하고있어?

내가 text-align: right; 인 경우 버튼을 클릭 할 수 있지만 왼쪽 객체를 한 행 아래로 밀어 넣습니다.

버그입니까? 어떻게 해결할 수 있습니까?

Firefox와 Chrome의 최신 버전에서 발생합니다.

편집 : 나는 버튼의 주요 "몸"unclickable이지만, 상위 1 픽셀 가장자리 (파이어 폭스) 클릭 할 수있는 것으로 나타났습니다 .

CSS 용 DIV;

#cmd-bar { 
    float: right; 
} 

DIV의 HTML 마크 업입니다.

<div id="cmd-bar"> 
    Select a command: 
    <button onClick="RunTask('start');">Start</button> 
    <button onClick="RunTask('end');">Stop</button> 
    <button onClick="RunTask('reset');">Reset</button> 
    <!--<progress id="progressbar" value="50" max="100"></progress> --> 
</div> 

버튼은 항상 래핑되며, 플로팅을 적용 할 때만 해당 버튼을 클릭하면 문제가됩니다.

Answer 1

문제가 오른쪽 버튼 위에 위치하는 img 의한 추가된다.

추가 :

position: relative; 
z-index: 100; 

#cmd-bar합니다.

이렇게하면 위에있는 이미지 위에 단추가 배치됩니다.

Answer 2

div "# status-img"를 클릭 취소 할 수 없게 만듭니다. 버튼 위에 있습니다!

는

#status-img { 
    margin-right: 500px; 
}