0

我遇到了一个问题,我的标签和文本框没有正确排列。

这就是我想要的,但无论我尝试什么都没有在此处输入图像描述发生:

这是CSS:

.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:

<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>

我怎样才能得到想要的效果?

4

1 回答 1

1

如果您想要正确对齐,请使用 html 表格来设计布局。

于 2013-07-03T16:20:06.707 回答