0
我有CSS一個div因爲這如何設置此高度自動div?
#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應該有自動高度,它會自動伸展
Post full CSS +嘗試在div上使用'relative'定位和'z-index:100;'。 – 2015-02-08 17:42:23
首先,將單獨的CSS文件中的樣式與內聯樣式混合並不是一個好主意。你已經聲明瞭固定的'height:height:480px';在'#middle2'樣式中,然後用inline'style =「height:auto; ...'覆蓋它;如果可以的話,避免這種情況 - 只能在單獨的CSS文件中定義樣式,如果希望它自動伸展,所有高度樣式('height:auto;'默認使用);其次,你指定了'position:absolute;'這意味着你已經打破了DOM組件的流動,這就是爲什麼footer沒有被壓下的原因。相對;'@ThePragmatick說 – Fallup 2015-02-08 17:48:32