html - 内联元素不对齐

标签 html css alignment

我从 simplesharebuttons.com 获得了这些共享按钮。我添加了一个更多按钮,最终将用于在较小的屏幕上取消隐藏不太受欢迎的社交媒体图标,但它没有与其余按钮对齐,我无法弄清楚问题出在哪里。

http://jsfiddle.net/WLSqw/41/

#share-buttons img {
    width: 35px;
    padding-right: 5px;
    display: inline;
}

#more {
    width: 35px;
    margin-right: 5px;
    background: #ccc;
    display: inline-block;
    border-radius: 50%;
    color: white;
    font-size: 1em;
    text-align: center;
    line-height: 35px;
}

最佳答案

实际上,作为一个 inline-block 元素,您的 #more 只需要:

vertical-align: top;

DEMO

关于html - 内联元素不对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23047839/

相关文章:

php - 在 CSS 中显示 MySQL 表

html - <a> 标签会取消对齐

html - 我怎样才能在底部制作 100 及以下?

html - 如何对齐容器内的一个 div 而另一个对齐到浏览器窗口的右端?

html - 对齐文本。使用表或 css 或?

c++ - Emacs 右对齐 ')'

javascript - Bootstrap .navbar-toggle 事件

javascript - 如何对滚动 Accordion div 进行操作

jquery - 在调整窗口大小时更改 jquery 值

html - 未能保持适当的位置(HTML/CSS)