html - 居中菜单按钮

标签 html css

我在尝试自定义 jekyll 主题时有点迷茫。我的存储库是 capecchi.github.io,我正在尝试让一些菜单图标居中。我研究了如何做到这一点,并成功地让博客/元素按钮居中,但出于某种原因,我下面的社交按钮稍微偏离了右边的中心。我能看到的唯一添加的类(在 header.html 中)是“navigation--social”类(在/css/uno.css 中定义),我找不到在这个类中它可能定义左边距的位置或任何东西。我是网络开发的新手,并且已经研究了很长时间(因此我添加了“测试”按钮)。我一直在寻找这个偏移量的来源,并希望得到任何意见。谢谢!

最佳答案

.navigation--social(uno.css 第 1391 行)上有 1.5em 的 margin-left。

实际上,移除这个边距可以很好地使按钮居中,但并不完美,因为 .navigation__item 上还有另一个 margin-right(uno.css 第 1376 行)。您应该放置等量的 margin-left 或移除 margin-right 以获得完美居中的按钮。

我通过使用 Firefox 的检查器发现了这一点。大多数浏览器都带有此功能,您可以通过右键单击页面并从上下文菜单中选择“检查元素”来打开它。

Screenshot of the inspector window showing the margins and the offending styles.

关于html - 居中菜单按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43308664/

相关文章:

javascript - 为什么我的 onclick 不会删除我的任何类(class)?

jquery - 独立的 div 切换

css - 为什么 Firefox/Chrome 响应式仿真和智能手机之间存在差异?

css - 无法选择 sibling

php - 租车 - 如何检查两个日期之间是否有车可用?

java - 制作一个页面来重新加载其缓存

html - 在 flask 中格式化html代码?

html - 如果我的用户没有我的网站使用的字体,我该如何让他们自动下载?

html - 让一个 li 填满剩余的宽度

javascript - 将倍数 'background' 添加到 css 类中