0

フォームに 3 つの div があります。1 つのメイン div と 2 つの子 div (1 つは左要素用、もう 1 つは右要素用)。私はすべてをうまく設定しました。ただし、ウィンドウのサイズを変更すると、左右の 2 つの div が互いに重なっています。これを行うための本物の方法を私に提案してください..

コードを表示

<div id="first" style="width: 100%;">
 <div class="divmain">
  <div class="divleft">
                <label class="label">
                    Invoice No.</label><span class="mand">*</span>
  </div>
  <div class="divright">
                @Html.TextBoxFor(model => model.No, new { @class = "txtbox" })
                @Html.ValidationMessageFor(model => model.No)
  </div>
 </div>
</div> 

CSS コード

.divmain
{
padding: 15px;
width: auto;
position: relative;
height: auto !important;

}

.divmain .divleft
{

position: absolute;
top: 0;
left: 1%;
bottom: 0;
height: auto;

}

.divmain .divright
{
position: absolute;
top: 0;
bottom: 0;
left: 16%;
}

デモのリンク

ウィンドウのサイズを変更しても、div は互いに重なってはならず、ウィンドウが最大化されたときと同じようにとどまる必要があります。

4

1 に答える 1

0

デモを見る!

.divmain
{
padding: 15px;
width: auto;
position: relative;
height: auto !important;
background:#CCCCCC;
}

.divmain .divleft
{
float:left;
width:auto;
top: 0;
left: 1%;
bottom: 0;
height: auto;
display:block;
background:#CCCFFF;
}

.divmain .divright
{
float:left;
width:auto;
top: 0;
bottom: 0;
left: 16%;
display:block; 
background:#CCFFFF;
}
于 2013-05-17T06:49:55.920 に答える