라디오 버튼을 서로 겹치게하는 가장 좋은 방법은 무엇입니까?

나는 라디오 버튼의 무리가 있고, 나는 각 한 후라디오 버튼을 서로 겹치게하는 가장 좋은 방법은 무엇입니까?

<br/>

을 가지고 있고 그들은 모두 (내가 정렬을 왼쪽 말한다 일부 CSS를 넣어 경우에도) 수평 정렬 센터로 보인다. 여기

는 CSS이며, 여기에

.radioLeft 
{ 
    text-align:left; 
}

는 HTML입니다 : 당신은 그 경우에, 라디오에 있지만 그들이에있는 컨테이너에이 스타일을 적용해서는 안

<input checked="checked" class="radioLeft" name="CalendarType" value="1" type="radio"><b>Person </b>(False) <br> 
<input checked="checked" class="radioLeft" name="CalendarType" value="2" type="radio"><b>Event </b>(False) <br> 
<input checked="checked" class="radioLeft" name="CalendarType" value="3" type="radio"><b>Release</b>(False) <br>

출처

2010-12-16 leora

Ooohh, oohh, '

'을 사용하고 있습니까? :-) – paxdiablo

조금 더 HTML을 넣어서 http://jsfiddle.net/d9Nvk/ – Fred

@Fred : 부모 요소에'text-align : center'가있는 것 같습니다. 그것을 다시 설정하십시오. – theazureshadow

답변

당신 div를 추가 할 수 있습니다.

<div class="radioLeft"> 
    <input checked="checked" name="CalendarType" value="1" type="radio"><b>Person </b>(False) <br> 
    <input checked="checked" name="CalendarType" value="2" type="radio"><b>Event </b>(False) <br> 
    <input checked="checked" name="CalendarType" value="3" type="radio"><b>Release</b>(False) <br> 
</div>

출처

2010-12-16 05:12:10 foX092

블록 수준 요소에만 적용되는 CSS 속성 (예 : div)를 인라인 요소 (input)에 연결합니다. 이것은 작동하지 않습니다. 당신은 블럭 레벨 요소를 만들 필요가 있습니다 (저는 label을 사용하고 CSS를 사용하여 블럭 레벨로 만들었지 만 그것은 의미를위한 것입니다). 그리고 각 레이블을 포함하기 위해 그것을 사용합니다. 클래스 .radioLeft으로 label의 각 포장

봅니다, 입력에서 해당 클래스를 제거하고이 CSS 추가 : 예를 들어

.radioLeft { 
    display: block; 
    text-align: left; 
}

, 당신의 정렬을 확인해야

<label class="radioLeft"><input type="radio"><b>Person</b>(False)</label>

출처

2010-12-16 05:12:25 theazureshadow

을 그것들을 둘러싸는 컨테이너.

출처

2010-12-16 05:16:19

다음 CSS 스타일로 시도해보십시오.

.radioLeft input{ 
    text-align: left; 
    display:inline; 
}

출처

2010-12-16 10:37:11

+1 for'display : inline' - 일들을 좀 더 단순하게 유지합니다. 일들이 일어나면'inline-block'을 사용할 수도 있습니다. SO에 오신 것을 환영합니다 :-) – Bojangles

라디오 버튼을 서로 겹치게하는 가장 좋은 방법은 무엇입니까?

답변

관련 문제