Question

所以我有一个需要各种东西的表单，最后是一个textarea（用HTML完成）。然后我制作一个图像提交按钮（我自己的图像）。

<label for="comments">Comments *</label>
<textarea type="comments" name="comments" value= "" maxlength="1000" cols="28" rows="6"></textarea>
<br />
<input type="image" src="../../images/submit.png" name="submit" />

但是，在textarea之后，它决定不将提交按钮居中。如果我把textarea拿出来并且它就在输入区域之后，那么它就会很好。

这是我表单的CSS（来自上面的内容）：

label{
    padding-top: 3px;
    padding-bottom: 3px;
}

textarea[type="comments"]{
    float: right;
    resize: vertical;
    overflow: auto;
    font-family: Calibri, Segoe UI, Trebuchet MS, Arial, sans-serif;
    font-size: 12px;
    border-style: none;
    border-color: black;
    border-width: 1px;
}

input[type="image"]{
    display: block;
    margin: 0 auto;
}

任何人都知道如何解决IE / Safari的问题？谢谢！

Answer 1

将clear:both添加到输入图像CSS。

为了更好地兼容旧浏览器，我建议您使用更简单的选择器，而不是利用属性选择器语法。也许在必要时添加类。

<textarea class="comments" ...></textarea>

制作选择器

textarea.comments {
  ...
}

在Safari / IE中的textarea之后，表单中提交的图像不会居中

1 个答案: