ASP.NET - 데이터 입력 situtaion에서 ASP.NET 컨트롤을 정렬하는 CSS를 사용하는 방법?

Question

ASP.NET에 기본 제공되는 표준 데이터 입력 형식 폼이 있습니다. 저는 CSS로 꽤 초록색이고 양식의 레이블과 텍스트 필드를 정렬하려고합니다.

표준 ASP.NET 컨트롤을 사용하고 있습니다.

나는 내 CSS 책과 웹 사이트에서 레이블을 사용하여 레이블을 플로팅 할 수있는 입력 텍스트 상자의 이름을 사용할 수 있음을 알고 있지만, ASP.NET에서는이를 수행하지 않습니다. ** 이것은 내가 함께 일하려고하는 것입니다 :

<div class="spacer1em"></div> 
<div><span>Hotel:</span> <asp:TextBox ID="txtHotel" runat="server" /> <asp:LinkButton ID="lnkMap" runat="server">Map</asp:LinkButton></div> 
<div><span>Address:</span><asp:TextBox ID="txtAddress" runat="server" /></div> 
<div><span>Address:</span><asp:TextBox ID="txtAddress2" runat="server" /></div> 
<div><span>City:</span> <asp:TextBox ID="txtCity" runat="server" /> <span>State:</span><asp:TextBox ID="txtState" runat="server" /> <span>Zip:</span> <asp:TextBox ID="txtZip" runat="server" /></div> 
<div><span>Country:</span> <asp:TextBox ID="txtCountry" runat="server" /></div> 
<div><span>Phone:</span> <asp:TextBox ID="txtPhone" runat="server" /> <span>Fax:</span><asp:TextBox ID="txtFax" runat="server" /></div> 
<div><span>Type:</span><asp:TextBox ID="txtType" runat="server" /></div> 
<div><span>Comments:</span> <asp:TextBox ID="txtComments" runat="server" /></div> 

Answer 1

여기 제가 사용하는 방법입니다.

<div class="row"> 
    <div class="label"> 
    <asp:Label ID="lblHotel" Text="Hotel" runat="server" AssociatedControlID="txtHotel" />: 
    </div> 
    <div class="value"> 
    <asp:TextBox ID="txtHotel" runat="server" /> 
    </div> 
</div > 
<style type="text/css"> 
    .row { clear: both; width: 100%; overflow: hidden; margin: 5px 0; } 
    .label { float: left; text-align: right; margin-right: 10px; width: 150px; } 
    .value { float: left; text-align: left; } 
</style>