Web 链接在移动显示上不起作用答案

【问题标题】：Web links not functioning on mobile displayWeb 链接在移动显示上不起作用
【发布时间】：2017-01-07 01:42:24
【问题描述】：

我使用基于网格的引导模板示例开发了我的投资组合网站。编码后，我尝试在移动设备上测试超链接。但链接在移动显示上不起作用。

我尝试了一些在网上找到的建议解决方案。但到目前为止还没有运气。任何人都可以帮我找到问题吗？请。

投资组合链接：https://pruthvirajn.github.io/

有问题的页面：联系页面（主页右上角的菜单选项）

链接不起作用：twitter 按钮、google+ 按钮和投资组合中的其他超链接。

【问题讨论】：

请提供您的代码，否则我们无能为力

标签： html css mobile bootstrap-modal

【解决方案1】：

如下所示，col-lg-12 text-center 覆盖了链接，因此当您尝试单击链接时，实际上是在单击 h2.project-title 的容器。

要解决此问题，请添加以下 CSS：

.contact col-lg-12.text-center {
  pointer-events: none;
}

这允许用户点击容器和链接。 More info on pointer-events.

或：

.contact col-lg-12.text-center {
  display: inline-block;
  width: 100%;
}

这使得容器只和标题一样高，允许你点击东西。

【讨论】：

非常感谢您提供如此详尽的解决方案和快速响应！使用第二个建议，我很容易实现了修复。

【解决方案2】：

您正在使用 Bootstrap，因此您可以使用一个类通过添加一个类来集中其链接，希望它可以工作<a target="_blank" href="https://twitter.com/PruthvirajNGS" class="btn-social btn-outline text-center"><i class="fa fa-fw fa-twitter"></i></a>

【讨论】：

非常感谢您的回复！我相信即使是这个解决方案也能解决我的问题。