顶部菜单CSS -存在对齐和链接问题
顶部菜单CSS -存在对齐和链接问题
提问于 2017-11-28 01:05:44
我正在尝试在这个网站的菜单上面做一个顶部栏，上面列出了联系信息和社交媒体图标(我会把它们从主菜单nav中拿出来) https://grownowsma.com/
我有三个问题：
1)我无法让第二个顶部栏的全部内容正确对齐。我想把它们放在"Get in contents“区域的上方-为此，我尝试了不同的CSS选择器，使用align: right和align-contents: right；没有成功
2)我希望电子邮件和电话号码垂直对齐，以便图标看起来更好。我尝试过不同的选择器垂直对齐:居中。我读到VA只适用于内联，但这是内联，所以我被难住了。
3)如果你点击Facebook图标，它就会打开，但如果你点击任何其他社交图标，它们就不会打开。我试着把每个社交图标包装在一起，也许分开会有帮助，但出于某种原因没有成功。你有什么想法改变HTML，让链接在所有四个社交媒体图标上都有效吗？
<p style="text-align: right; font-family: 'Muli'; vertical-align: center;">
<a href="mailto:josh@grownowsma.com">josh@grownowsma.com</a> | <em><a
href="tel:(978)%20857-4349" target="_blank" rel="noopener">978-857-
4349 </a> | </em><span><a href="https://www.facebook.com/Grow-Now-Social-
Media-Agency-1275074409247860/" target="_blank" rel="noopener"><img
class="alignnone wp-image-520" src="https://grownowsma.com/wp-
content/uploads/2017/11/facebook.png" alt="" width="25" height="25" /> </a>
</span><span><a href="https://twitter.com/grownowsma" target="_blank"
rel="noopener"><img class="alignnone wp-image-519"
src="https://grownowsma.com/wp-content/uploads/2017/11/twitter.png" alt=""
width="25" height="25" /></a></span><span> <a
href="https://www.instagram.com/grownowsma/" target="_blank"
rel="noopener"> </a><a href="https://www.instagram.com/grownowsma/"
target="_blank" rel="noopener"><img class="alignnone wp-image-521"
src="https://grownowsma.com/wp-content/uploads/2017/11/instagram.png" alt=""
width="25" height="25" /> </a></span><span><a
href="https://www.linkedin.com/company/11331850/" target="_blank"
rel="noopener"><img class="alignnone wp-image-518"
src="https://grownowsma.com/wp-content/uploads/2017/11/linkedin.png" alt=""
width="25" height="25" /></a></span>
</p>
回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47516264
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号