歌剧的文本对齐中心 - css

Question

如果Chrome看起来像这样：

.text-center {
  text-align: -webkit-center;
}

和firefox：

.text-center {
  text-align: -moz-center;
}

在歌剧中怎么样？

.text-center {
  text-align: -o-center;
}

无效。

更新

HTML：

  .container
    .text-center.label-margin
      %h3
        .bubble LEADERSHIP

我的泡泡类的CSS。

.bubble {
  position: relative;
  width: 170px;
  height: 45px;
  padding: 11px 0 0 0 !important;
  background-color: #333333 !important;
  font-style: normal !important;
  font-family: 'Fira Sans', sans-serif;
  font-size: 25px;
  font-weight: 600;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  color: #fff;
}

在OPera

中看起来像

Answer 1

您不需要为text-align属性添加前缀。你可以简单地使用：

text-align:center;

代替（适用于所有浏览器）。

进一步阅读：

文字对齐属性
• W3.org documentation。
• 这是一篇非常好的CSS-Tricks文章，您可能觉得它很有用。
• 如果我们正在谈论任何财产，caniuse...是最好的财产之一。浏览器兼容性网站，几乎所有css属性的信息。

请注意：Border-radius不需要加前缀（现在已经很长时间没有完成），而使用!important被认为是不好的做法，所以我个人建议离开使用它的习惯。

Answer 2

请尝试以下操作： Demo

div

不需要专门用于所有浏览器，因为它几乎被所有浏览器接受