html - 使输入框始终居中

Question

这很简单，或者看起来很简单，但我做不到。

我只是想始终保持我的表单输入居中，并响应窗口大小的变化。

相反，它停留在左侧。

这是下面的 html 和 css 代码:-

    #teaser-input{
    	max-width:100%;
    }
    	#teaser-input input{
    		margin:auto;
    		font-size:2.0em;
    		color:#36393D;
    		text-align:center;
    
    	}

    <div id="teaser-input">
    	<form>
    		<input type="text" name="email" value="Notify me at: you@provider.com">
    	</form>
    </div><!--teaser-input-->

Answer 1

我在您的 CSS 中为 input 元素添加了 display: block; 并且有效，请参阅:fiddle

此外，您还可以调整屏幕大小并且它是响应式的。