RadioButtonList asp.net Control의 목록 항목 사이에 공백을 추가하는 방법은 무엇입니까?

Question

문제를 찾기 위해 몇 시간을 보냈고 몇 가지 시도를 해본 결과 해결책이없는 것 같습니다. 다음과 같은 RadioButtonList 컨트롤이 있습니다.

<asp:RadioButtonList ID="rblCheck" runat="server" RepeatDirection="horizontal"> 
<asp:ListItem Value="red">Red</asp:ListItem> 
<asp:ListItem Value="green">Green</asp:ListItem> 
</asp:RadioButtonList> 

이제 브라우저에서 두 단추가 실제로 가까이 있습니다. 그들을 구출 할 수있는 방법이 있습니까? 나는 margin-left css를 시도했다. 그러나 그것은 그것을 분류하지 않았다. 어떤 제안이 굉장 할 것입니다. 감사.

Answer 1

당신은 여러 가지 방법으로 그것을 할 수 있습니다. 예를 들어, CssClass 속성을 RadioButtonList 컨트롤로 설정할 수 있습니다. 아래를보십시오.

<asp:RadioButtonList ID="rblCheck" runat="server" RepeatDirection="horizontal" CssClass="spaced"> 
<asp:ListItem Value="red">Red</asp:ListItem> 
<asp:ListItem Value="green">Green</asp:ListItem> 
</asp:RadioButtonList> 

는 그런 다음 CSS 선언에이

.spaced input[type="radio"] 
{ 
    margin-right: 50px; /* Or any other value */ 
} 

처럼 spaced 클래스를 정의 할 수 있습니다 또는 당신이 목록 항목에 대해 서로 다른 간격을 사용하고자하는 경우 각각에 대해 style 속성을 지정하여 작업을 수행 할 수 있습니다 listitem이 방법은

<asp:RadioButtonList ID="rblCheck" runat="server" RepeatDirection="horizontal"> 
<asp:ListItem Value="red" style="margin-right:20px">Red</asp:ListItem> 
<asp:ListItem Value="green" style="margin-right:30px">Green</asp:ListItem> 
</asp:RadioButtonList> 

Answer 2

어떻게 그 목록에 CSS를 할당 했습니까? 내가 물어 보는 이유는 작동하지 않는 ID "rblCheck"를 참조하여 CSS를 목록에 할당하려고했기 때문입니다 (.NET은 ID를 변경하고 일부 숫자를 값에 추가합니다).

CSS를 인라인으로 추가하거나 목록에 CSS를 할당 할 클래스를 제공하십시오.

Answer 3

은 그냥 몇 가지 CSS를 추가

input[type="radio"] { 
margin: 10px 10px; 
} 

Answer 4

는 그냥

에 대한 몇 가지 CSS를 추가

input[type=radio] { 
    margin-left: 8px; 
}