我有一个div与css这个
#middle2 {
background: none repeat scroll 0 0 #ffffff;
border: 1px solid #e5e5e5;
border-radius: 15px;
height: 480px;
margin-left: 230px;
margin-top: 20px;
position: absolute;
width: 500px;
}
html就是这个
<div id="middle2" style="height: auto; overflow: hidden;">
<div id="envelop"></div>
<div id="envelop_title">Create your Account</div>
<div id="e_text">
<p>Creating a account is very easy. Just fill-in the form below, click Submit and then proceed to Login! All done!
</p>
</div>
<div id="c_form">
<div id="form_content" style="height:auto; overflow: hidden;">
<form method="post" action="#" onsubmit="return validation()">
<div class="form_row">
<label class=""><span class="star">*</span> First Name</label>
<div class="inputstyle">
<input class="input_col2" type="text" value="" name="first_name" id="np_first_name"/>
<div id="firstName_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Last Name</label>
<div class="inputstyle">
<input class="input_col2" type="text" value="" name="last_name" id="np_last_name"/>
<div id="lastName_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> E-mail</label>
<div class="inputstyle">
<input class="input_col2" type="text" value="" name="email" id="np_email" onkeyup="check_email()" autocomplete="off"/>
<input type="hidden" id="ch_add" name="ch_add" value="">
<div id="email_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Password </label>
<div class="inputstyle">
<input class="input_col2" type="password" value="" name="password" id="np_password"/>
<div id="pwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Confirm Password </label>
<div class="inputstyle">
<input class="input_col2" type="password" value="" name="cpassword" id="np_cpassword"/>
<input type="hidden" name="ip" id="np_ip" value="<?php echo $this->input->ip_address();?>">
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Contact </label>
<div class="inputstyle">
<input class="input_col2" type="text" value="" name="contact" id="contact"/>
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Address </label>
<div class="inputstyle">
<textarea class="input_col2" name="address" id="address"></textarea>
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> Country </label>
<div class="inputstyle">
<select class="input_col2" id="country" name="country"
onchange="get_state(this.value,'state');">
<option value="0">Select Country</option>
<?php
$country_list = $this->autoload_model->get_data_from_table("td_country","*",
"country_title LIKE '%Canada%'")->result_array();
foreach($country as $bil_cnt)
{?>
<option value="<?php echo $bil_cnt['country_id'];?>">
<?php echo $bil_cnt['country_title'];?>
</option>
<?php
}?>
</select>
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> State </label>
<div class="inputstyle">
<img src="<?php echo base_url();?>assets/front_assets/images/ajax-loader-1.gif" style="margin: 0 0 0 20px; display:none" id="state_loader"/>
<select class="input_col2" id="state" name="state"
onchange="get_city(this.value,'city')">
<option value="0">Select State</option>
</select>
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row">
<label class=""><span class="star">*</span> City </label>
<div class="inputstyle">
<img src="<?php echo base_url();?>assets/front_assets/images/ajax-loader-1.gif" style="margin: 0 0 0 20px; display:none" id="city_loader"/>
<select class="input_col2" id="city" name="city">
<option value="0">Select City/Suburb</option>
</select>
<div id="cpwd_msg" class="div_msg"></div>
</div>
</div>
<div class="form_row" id="np_register_message">
</div>
<div id="f_button" style="width:123px; height:34px; margin:0 auto; margin-top:30px;">
<a href="javascript:void(0)" id="np_reg_button"><img src="<?php echo base_url();?>assets/front_assets/images/button.jpg" style="width:98px;height:35px;"/></a>
</div>
<div id="f_bottom"></div>
</form>
</div>
</div>
</div>
但问题是我以这种方式得到了div?
我该如何解决这个问题。我希望div应该有自动高度,它会自动拉伸
答案 0 :(得分:0)
如果我正确地解释你的图像,div会自动调整它的高度。
但是,因为你已经使用过:
position: absolute
div不再在页面流中。这意味着它下面的元素可以向上移动重叠。
如果这是问题,可以通过多种方式修复它,具体取决于页面的其余部分。