所以我有一个通过AJAX填充的div,当它改变大小时,它旁边的div向下移动,旁边的div的下边缘。如何获得它以使右边的div保持不变?
<div class="body">
<div class="slection">
<div class="selector">
<select name="users" onchange="showUser(this.value)">
<option value="Select day...">Select day...</option>
<?php
$pathToMe = dirname(__FILE__);
$path = $pathToMe . "/days/";
$handle=opendir($path);
while ($file=readdir($handle))
{
if (($file == ".") || ($file == "..")){
}
else echo "\t<option value='".$file."'>".$file."</option>\n";
}
?>
</select>
</div>
<div id="content"></div>
</div>
<div class="sms">
<div style="text-align:center">
Send SMS to client
</div>
<div style="text-align:center">
<div id="contact_form">
<form name="contact" action="">
<fieldset>
<input type="text" name="number" id="number" size="14" value="Number" class="text-input" />
<br /><br />
<textarea type="text" name="message" id="message" value="Message" class="text-input"></textarea>
<br />
<input type="submit" name="submit" class="button" id="submit_btn" value="Send" />
</fieldset>
</form>
</div>
</div>
</div>
</div>
CSS:
.header {
height:30px;
}
.body {
min-width:400px;
max-width:700px;
min-height:200px;
margin-left:auto;
margin-right:auto;
width:500px
}
.sms {
float:right;
margin-top:-20px;
}
.selection {
float:left;
}
直播示例here。
答案 0 :(得分:1)
添加
pre{
width:200px;
float:left;
}
到您的CSS。
目前pre
占据整个区域的宽度。将其定义为200px宽仍然不会使其他元素达到与display:inline;
不同的水平,因此这也是您需要float
的原因。