위치 라디오 버튼 배경 이미지 위에 위치

Question

나는 backgorund 이미지가 있고, 빨간 삼각형 (그림과 같이 here)에 가까운 라디오 버튼 (라디오 버튼의 원은 숨겨지고 레이블 만 나타납니다)을 배치하고자합니다. . 어떻게해야합니까? 여기

input[type="radio"] { 
 
    display: none; 
 
} 
 
input[type="radio"]:checked + label { 
 
    border: 2px solid red; 
 
}

<img src="http://i.stack.imgur.com/CUTm6.png" alt="Synoptic table" align="center"> 
 
<div class="buton"> 
 
    <input type="radio" name="a" value="a" id="a" /> 
 
    <label for="a">text radio 1</label> 
 
</div> 
 
<div class="buton"> 
 
    <input type="radio" name="a" value="b" id="b" /> 
 
    <label for="b">text radio 2</label> 
 
</div> 
 
<div class="buton"> 
 
    <input type="radio" name="a" value="c" id="c" /> 
 
    <label for="c">text radio 3</label> 
 
</div>

확인

Answer 1

내 코드를 참조하십시오, 그것을 해결하기 위해 관리. 라디오 버튼을 포함하는 div에 스타일로 위치를 지정합니다.

<div class="buton" style="position:absolute; left:400px; top:250px"> 
    <input type="radio" name="a" value="b" id="b" /> <label for="b"> radio text 2 </label> 
</div>