代码之家 › 专栏 › 技术社区 › Marcus.Aurelianus

在固定宽度按钮内对齐文本

alignment css html

Marcus.Aurelianus · 技术社区 · 6 年前

我试图将“>”文本与固定宽度的按钮对齐。我试过对齐文本,但从观察结果看它不是居中对齐的。

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    .naviButton {
      height:34px;
      width:16px;
      color:grey;
      text-align:center;
      position:relative;
    }
    </style>
    </head>
    <body>

    <button class="naviButton"><</button>

    </body>
    </html>

如果删除固定宽度,“>”将居中。

我怀疑这里对齐的元素实际上是“>”文本的起始位置。但是,我可以将文本居中吗?

任何人都知道它能以固定宽度居中吗?非常感谢!

1 回复 | 直到 6 年前

Casper 6 年前

使用 padding: 0;

.naviButton {
   height:34px;
   width:16px;
   color:grey;
   text-align:center;
   position:relative;
   padding: 0;
 }

<button class="naviButton"><</button>

推荐文章

PkDrew · 在结构定义中声明“alignas”关键字与结构定义的数组之间有什么区别吗?

1 年前

Rad · 点击下拉菜单按钮时,它会在框架内移动

2 年前

David Lytle · Javascript幻灯片对齐

2 年前

Hana.HD · 如何在flutter中更改listtile中标题和副标题的对齐方式?(从右到左)

2 年前

2 年前

CheeseFlavored · CSS-如何根据屏幕大小更改DIV的顺序?

2 年前

Riya · 如何将imageview放置在线性布局水平方向的右端

2 年前

Kris · 如何将视口外DIV与可见视口DIV完美对齐

3 年前

Ihsan Ahmad · 文本输入和复选框输入不对齐

3 年前

Dragynjump · 为什么对齐按钮中的项目会更改按钮的位置?

3 年前