Question

我的html页面看起来像我想要的，突然我的输入文本变得比我想要的大一点，我试图对其进行修复，发现我放置的<!DOCTYPE html>可以做到这一点：

具有<！DOCTYPE html>

这是放置<！DOCTYPE html>

之前的外观

这是我的代码：

<select style="font-size:20px;padding-left:20px;border-radius:20px; height:40px;width:80%;max-width:500px;" onchange="change(this)" id="pitanja">
  <option value="1">Prvo pitanje?</option>
  <option value="2">Drugo pitanje?</option>
  <option value="3">Treće pitanje?</option>
  <option value="4">Četvrto pitanje?</option>
  <option value="5">Peto pitanje?</option>
  <option value="6">Šesto pitanje?</option>
  <option value="7">Sedmo pitanje?</option>
  <option value="8">Osmo pitanje?</option>
  <option value="9">Deveto pitanje?</option>
  <option value="10">Deseto pitanje?</option>
</select>

<p><input type="text" style="font-size:20px;padding-left:20px;border:solid 1px black;height:40px;width:80%;max-width:500px;border-radius:20px;" id="pitanje_text" onchange="change2(this)"/></p>

为什么<!DOCTYPE html>会导致这种情况，我应该将其删除还是有更好的解决方案？谢谢！

Answer 1

将以下代码添加到下部输入中，以在元素的总宽度和高度中包括填充和边框。这应该可以解决。

box-sizing: border-box;

更改输入文本框的大小（高度和宽度）

1 个答案: