如何使用CSS集中textarea？

Question

原谅我提出这么简单的问题,我是HTML和CSS的新手.有一个简单的方法来中心textarea？我想我会尝试使用

textarea{
    margin-left: auto;
    margin-right: auto;
}

但它(显然？)没有用.

Answer 1

边距不会影响textarea,因为它不是块级元素,但如果您愿意,可以使其显示块:

textarea {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

默认情况下,textareas display: inline,这就是为什么你可以轻松并排放置它们,以及为什么text-align: center答案也可以工作.

textarea也可以通过将它放在一个flexbox容器中居中,如下所示:

<style>
    div.justified {
        display: flex;
        justify-content: center;
    }
</style>

<div class="justified">
    <textarea>Textarea</textarea>
</div>

Answer 2

text-align元素的父元素集center,如下所示:

HTML:

<div>
    <textarea></textarea>
<div>

CSS:

div { text-align: center; }

这是一个例子:http://jsfiddle.net/ujzLt/