请问大神我下面代码的搜索框怎么设置不了高度啊?line-height,padding都写上了也没用

<html>
<style>
#search-box{width:200px;height:100px;
box-sizing:border-box;padding:50px;line-height:100px;}

</style>

<body>

        <form id="search-bar" class="hide" action="/action_page.php">

            <input id="search-box" type="search" value="search">
            <input id="search-submit" type="submit">

        </form>
            <button id="search-but" >click me</button>


</body>
</html>
阅读 3.3k
3 个回答

搜索框本身就是inline-block应该是可以设置高度的,就算可能是浏览器问题使得inline-block高度不起效,你设置了display:block之后肯定是能设置高度的,我测试了一下你的代码,我这边(谷歌浏览器)设置的高度是能起效的,所以你看看是其他地方出了问题,换个浏览器看看,或者是样式覆盖的问题查查看。
图片描述

添加一个display:block属性试试看

input输入框默认是inline-block的样式,无法设置高度和line-height,添加样式display:block即可

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题