1

ASP.NET での Web 開発は初めてで、小さな Web サイトを設計したばかりです。設計時にはコントロールを正しく配置しましたが、実行時にはコントロールが重なって表示されます。ソース ビューを確認しましたが、左と上の値は問題ありませんでした。次のスクリーン ショットをご覧ください。

設計時:

ここに画像の説明を入力

Chrome および IE での実行時:

ここに画像の説明を入力

モジラでは:

ここに画像の説明を入力

テキスト ボックスのソース ビューでの私のコード:

<asp:TextBox ID="TextBox1" runat="server" 
    style="z-index: 1; left: 102px; top: 339px; position: absolute"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server" 
    style="z-index: 1; left: 247px; top: 327px; position: absolute"></asp:TextBox>
<asp:TextBox ID="TextBox3" runat="server" 
    style="z-index: 1; left: 248px; top: 360px; position: absolute"></asp:TextBox>

簡単な解決策があるかもしれませんが、私はこれに慣れていないので、何をしなければならないか教えてください。

4

1 に答える 1

0

マークアップを少し再編成します。あなたは試すことができます：

<div style="position: absolute; left: 102px; top: 327px;">
    <div id="left_column" style="float:left">
        <asp:TextBox ID="TextBox1" runat="server" />
    </div>
    <div id="right_column" style="float: left; margin-left: 15px;">
        <asp:TextBox ID="TextBox2" runat="server" />
        <asp:TextBox ID="TextBox3" runat="server" />
    </div>
</div>

要素間の間隔を広げたい場合は、余白やパディングを追加してください。

于 2012-09-02T08:52:23.950 に答える