如何制作文本框和textarea相同宽度的跨浏览器？

要制作一个文本框和一个textarea相同宽度的跨浏览器，可以使用CSS来设置宽度和样式。以下是一个简单的HTML和CSS示例：

<!DOCTYPE html>
<html>
<head><style>
  .input-container {
    display: flex;
    flex-direction: column;
  }

  .input-container label {
    margin-bottom: 5px;
  }

  .input-container input[type="text"],
  .input-container textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
  }
</style>
</head>
<body>

<div class="input-container">
 <label for="text-input">文本框：</label>
 <input type="text" id="text-input" name="text-input">
</div>

<div class="input-container">
 <label for="textarea-input">文本域：</label>
 <textarea id="textarea-input" name="textarea-input" rows="4"></textarea>
</div>

</body>
</html>

在这个示例中，我们使用了CSS来设置文本框和文本域的宽度为100%，并添加了一些内边距、边框和圆角。我们还使用了resize: vertical属性来允许文本域垂直调整大小。

这个示例应该在大多数现代浏览器中都能正常工作，包括Chrome、Firefox、Safari和Edge。如果您需要支持更多浏览器，可能需要添加一些额外的CSS代码或使用JavaScript来确保兼容性。