我正在尝试均匀放置下拉框。我希望每当用户选择一个下拉框时,选项均等地间隔开。我尝试使用保证金,但这似乎行得通,但是由于某些原因,我无法将其推得足够低。...
<div class="subscriptionplan">
<select name="subscriptionplan">
<option value="">Choose Subscription Plan 1</option>
<option value="None">None</option>
<option value="Level 1">Level 1</option>
<option value="Level 2">Level 2</option>
<option value="Level 3">Level 3</option>
</select>
<br></br>
<select name="pricing_level1">
<option value="">Choose a price plan for Level 1</option>
<option value="None">None</option>
<option value="100">Monthly:$100</option>
<option value="800">Yearly:$800</option>
</select>
<br></br>
<select name="pricing_level2">
<option value="">Choose a price plan for Level 2</option>
<option value="None">None</option>
<option value="150">Monthly:$150</option>
<option value="1300">Yearly:$1300</option>
</select>
<br></br>
<select name="pricing_level3">
<option value="">Choose a price plan for Level 3</option>
<option value="None">None</option>
<option value="200">Monthly:$200</option>
<option value="1800">Yearly:$1800</option>
</select>
<br></br>
<button type="submit" name="submit">Sign up</button>
</form>
</div>
This is the CSS code:
div.subscriptionplan {
position: absolute;
right: 180em;
bottom: 60em;
}
div.subscriptionplan select{
margin: 180em;
}
答案 0 :(得分:0)
em不等于px。
div.subscriptionplan {
position: absolute;
right: 180em;
bottom: 60em;
}
div.subscriptionplan select{
margin: 180em;
}
/ * ------------------------ * / 您没有添加绝对位置的上下文。 假设您需要CSS并排放置选择框,请参考以下内容。您可以删除br标签。
div.subscriptionplan {
/* position: absolute;
right: 180em;
bottom: 60em;*/
display:block;
width:100%;
}
div.subscriptionplan select{
/* margin: 180em;*/
margin:0.5em;
display:inline-block;
max-width:33.3%;
}