HTML框格式

Question

所以我有一些JavaScript代码，每次点击一个按钮就会创建两个新的输入字段，现在它们显示有点好笑。我在下面附上了一张照片。代码也在下面。我希望名称字段显示与更大框的顶部对齐，有没有办法做到这一点？

var div = document.createElement("div");
div.innerHTML = "<b>Checkpoint " + markerId + ":</b> <input type='text' id=" + markerId + " placeholder='Checkpoint name'> <textarea rows='5' cols='40' id=" + markerId + "desc> Checkpoint description </textarea> <button type='submit' value='Remove' onClick='remove_checkpoint();' /> <br />";
document.getElementById("divForms").appendChild(div);

谢谢！

Answer 1

是。你可以这样做：

在CSS中：

textarea {vertical-align: top;}

小提琴：http://jsfiddle.net/praveenscience/xPmY2/

---

或者，如果您不喜欢使用CSS，请以这种方式内联样式：

<textarea style="vertical-align: top;">Checkpoint description</textarea>

小提琴：http://jsfiddle.net/praveenscience/xPmY2/1/

---

但是我建议你使用CSS版本，因为内联样式很笨拙。

<强>截图