2013-07-03 3 views
0

레이블과 텍스트 상자가 올바르게 정렬되지 않는 문제가 있습니다. 텍스트 상자와 레이블이 올바르게 정렬되지 않습니다.

내가 원하는 것입니다,하지만 난 그것을 시도 상관없이이 enter image description here 일어나는되지 않습니다 :

.dropDownList 
{ 
float:left; 
font-size:12px; 
padding:4px 2px; 
border:solid 1px #aacfe4; 
width:206px; 
margin:2px 0 20px 10px; 
} 

.descriptionBox 
{ 

font-size:12px; 
padding:4px 2px; 
border:solid 1px #aacfe4; 
width:47em; 
height:100px; 
margin:2px 0 20px 10px; 
} 
.center 
{ 
text-align:center; 
padding:100px; 
} 

p, h1, form, button{border:0; margin:0; padding:0;} 
.spacer{clear:both; height:1px;} 
/* ----------- My Form ----------- */ 
.myform{ 
margin:0 auto; 
width:50em; 
padding:14px; 
} 

#stylized{ 
border:solid 2px #7fc041; 
background:#FDE16D; 
} 
#stylized h1 { 
font-size:14px; 
font-weight:bold; 
margin-bottom:8px; 
} 
#stylized p{ 
font-size:11px; 
color:#666666; 
margin-bottom:20px; 
border-bottom:solid 1px #7fc041; 
padding-bottom:10px; 
} 
#stylized label{ 
display:block; 
font-weight:bold; 
text-align:right; 
width:140px; 
float:left; 
} 
#stylized .small{ 
color:#666666; 
display:block; 
font-size:11px; 
font-weight:normal; 
text-align:right; 
width:140px; 
} 
#stylized input{ 
float:left; 
font-size:12px; 
padding:4px 2px; 
border:solid 1px #aacfe4; 
width:200px; 
margin:2px 0 20px 10px; 
} 

그리고 ASP 서버 컨트롤/HTML :

다음

는 CSS입니다
<div id="stylized" class="myform"> 
     <form id="form" name="form" method="post"> 
     <h1> 
      Non-Scrum Stories</h1> 
     <p> 
      <asp:RadioButtonList ID="RadioButtonList1" runat="server" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged" 
       AutoPostBack="true" RepeatDirection="Horizontal"> 
       <asp:ListItem Selected="True">Add New</asp:ListItem> 
       <asp:ListItem>Update or Delete</asp:ListItem> 
      </asp:RadioButtonList> 
     </p> 
     <asp:Panel ID="newPanel" runat="server" Visible="true"> 

      <label> 
       <asp:Label ID="Label7" runat="server" Text="Catagory:"></asp:Label> 
      </label> 
      <asp:DropDownList ID="catagoryDropDown" runat="server" DataSourceID="SqlDataSource3" 
       DataTextField="Catagory" DataValueField="PK_SupportCatagory" CssClass="dropDownList"> 
      </asp:DropDownList> 
      <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:ApplicationServices %>" 
       SelectCommand="SELECT [PK_SupportCatagory], [Catagory] FROM [SupportCatagory]"> 
      </asp:SqlDataSource> 
         <label> 
       <asp:Label ID="label5" runat="server" Text="Date Completed:"></asp:Label> 
      </label> 
      <BDP:BasicDatePicker ID="dateInput" runat="server"> 
      </BDP:BasicDatePicker> 
      <label> 
       <asp:Label ID="Label2" runat="server" Text="Application:" CssClass="leftFloat"></asp:Label> 
      </label> 
      <asp:DropDownList ID="applicationDropDown" runat="server" DataSourceID="SqlDataSource2" 
       DataTextField="AppName" DataValueField="PK_Application" CssClass="dropDownList" > 
      </asp:DropDownList> 
      <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:ApplicationServices %>" 
       SelectCommand="SELECT [PK_Application], [AppName] FROM [Application]"></asp:SqlDataSource> 
      <label> 
      <asp:Label ID="Label3" runat="server" Text="Incident #:"></asp:Label> 
      </label> 
      <asp:TextBox ID="incidentInput" runat="server"></asp:TextBox> 
      <label> 
      <asp:Label ID="Label6" runat="server" Text="Hours:"></asp:Label> 
      </label> 
      <asp:TextBox ID="hoursInput" runat="server"></asp:TextBox> 
      <label><asp:Label ID="Label4" runat="server" Text="Description: "></asp:Label></label> 

    <asp:TextBox ID="descriptionInput" runat="server" Rows="10" TextMode="multiline" CssClass="descriptionBox"></asp:TextBox> 

      <button type="submit"> 
       Sign-up</button> 
      <div class="spacer"> 
      </div> 
     </form> 
    </div> 
    </asp:Panel> 

원하는 효과를 얻으려면 어떻게해야합니까?

답변

1

적절한 정렬을 원한다면 html 테이블을 사용하여 레이아웃을 디자인하십시오.

관련 문제