【问题标题】:Vertical align html input text on Blackberry在黑莓上垂直对齐 html 输入文本
【发布时间】:2012-08-17 07:51:24
【问题描述】:

有人知道如何在黑莓设备上将输入类型文本中的文本居中吗?

这是我的 CSS:

.input_text {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    color: #333333;
    text-align: left;
    border: 1px solid #cccccc;
    vertical-align: middle; 
    width: 305px;
    height: 38px;
    line-height: 38px;
    vertical-align: middle;
    -webkit-appearance: none; 
    -webkit-border-radius:0px;
    -moz-border-radius:0px;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    box-align: center;
}

它适用于除黑莓以外的所有浏览器/设备。

【问题讨论】:

  • 垂直对齐有点麻烦。它在大多数元素上都无法按预期工作。你的文本框是多行的还是单行的?
  • 文字目前在BB上做什么?是否与底部对齐?如果是这样,在输入字段中添加与顶部空间相等的填充可能会解决您的问题。

标签: html css blackberry text input


【解决方案1】:

您可以使用填充来代替巨大的line-heightvertical-align: middle

.input_text {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    color: #333333;
    text-align: left;
    border: 1px solid #cccccc;
    width: 305px;
    height: 38px;
    padding: 12px 0; /***  12px = (38px - 14px) / 2  ***/ 
    -webkit-appearance: none;
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-12-16
    • 2013-03-13
    • 2011-07-08
    • 2021-06-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多