我想重新创建谷歌高级搜索页面,其中有形式输入4输入:我希望表单的标签对齐。这是html页面(我希望使元素具有固定宽度是adv_search_option_lbl:
<div id="adv_search_options_body">
<div>
<label **class="adv_search_option_lbl">**all these words:</label>
<input class="adv_search_input" type="text" for="as_epq" class="adv_search_input_txt">
<label class="adv_search_hint_lbl">Type the important words:"<span class="adv_search_hint_ie">tri-colour rat terrier</span></label>
</div>
<div>
<label class="adv_search_option_lbl">this exact word or phrase:</label>
<input class="adv_search_input" type="text" for="as_q" class="adv_search_input_txt">
<label class="adv_search_hint_lbl">Put exact words in quotes:"<span class="adv_search_hint_ie">"rat terrier"</span></label>
</div>
<div>
<label class="adv_search_option_lbl">any of these words:</label>
<input class="adv_search_input" type="text" for="as_oq" class="adv_search_input_txt">
<label class="adv_search_hint_lbl">Type OR between all the words you want:"<span class="adv_search_hint_ie">miniature OR standard</span></label>
</div>
<div>
<label class="adv_search_option_lbl">none of these words:</label>
<input class="adv_search_input" type="text" for="as_eq" class="adv_search_input_txt">
<label class="adv_search_hint_lbl">Put a minus sign just before words that you don't want:"<span class="adv_search_hint_ie"> -rodent, -"Jack Russell"</span></label>
</div>
</div>
这是CSS:
.adv_search_option_lbl {
font-size: 10px;
height: 50px;
}
.adv_search_hint_lbl {
font-size: 9px;
}
.adv_search_hint_ie {
font-family: monospace;
}
#adv_search_options_body {
font-family: Arial, Helvetica, sans-serif;
display: flex;
flex-direction: column;
width: 150vh;
justify-content: space-between;
margin-bottom:10px;
}
有什么建议吗?
我想对齐adv_search_input元素。
2条答案
按热度按时间h43kikqp1#
如果你想给予一个元素一个固定的宽度,把这个元素显示为一个块元素,然后把这个宽度加到css:
例如,如果.adv_search_option_lbl的宽度需要为100px:
这也适用于其他元素,只需将其设为块元素,即可控制尺寸。
zpgglvta2#
这是你要找的吗
超文本标记语言
中央支助系统