如何使文本与文本区域的中心对齐? [英] How to keep text aligned with the middle of a textarea?

查看:68
本文介绍了如何使文本与文本区域的中心对齐?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<html>
<body>

This should be level with the middle of the box!
<textarea id="id" name="name" rows="9" cols="50">Text is in here!</textarea>

</body>
</html>

图片最终看起来像.

我如何做到这一点,以使即使拖动该框,框左侧的文本仍保持与该框中间的水平?可以使用CSS完成,还是需要Javascript?

How do I make it so that the text to the left of the box stays level with the middle of the box, even if it's being dragged around? Can it be done with CSS, or will it require Javascript?

推荐答案

您需要将text和textarea都设置为vertical-align: middle. HTML示例:

You need to set both the text and textarea to vertical-align: middle. Example HTML:

.middletext {
  vertical-align: middle;
}

#id {
  vertical-align: middle;
}

<html>

<body>

  <span class="middletext">This should be level with the middle of the box!</span>
  <textarea id="id" name="name" rows="9" cols="50">Text is in here!</textarea>

</body>

</html>

如果要在文本上设置宽度/高度,请在.middletext类中添加display: inline-block.

If you want to set a width/height on the text, add display: inline-block to the .middletext class.

这篇关于如何使文本与文本区域的中心对齐?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆