css - twitter 关注按钮和 facebook like 按钮在调整窗口大小时不起作用

Question

我正在使用 bootstrap 3 css 框架。

我添加了 facebook like buttona 和 twitter 关注按钮。当我不调整窗口大小时它可以工作。当我调整窗口大小时，出现 twitter 和 facebook 按钮但我无法单击它（当我将鼠标悬停在这些按钮上时没有超链接鼠标符号）

当我调整窗口大小并且当点达到按钮移动到下一行时，按钮不再可点击我该如何解决这个问题？

<div class="row" style="padding-top:4px;padding-left:4px;padding-right:4px; background:#09C;">
        <div class="container">
            <div class="row">
                <div class="col-md-4">
                    <div class="input-group input-group-sm" style="padding-bottom:4px;">
                        <input type="text" class="form-control">
                        <span class="input-group-btn">
                            <button class="btn btn-default btn-sm" type="button">Go</button>
                        </span>
                    </div>
                </div>
                <div class="col-md-5">
                <div class="pull-right" style="margin-top:10px;">
<!-- my social buttons are here-->
<!-- facebook and twitter are embedded inside iframe
</div></div></div>
        </div>
    </div>

jsfiddle http://jsfiddle.net/VZk5G/

Answer 1

具有.col-md-3类的 div 用这些按钮 ( .col-md-5 ) 悬停在 div 上。使用z-index来解决这个问题：

.col-md-3
{
    z-index: 2;
}
.col-md-5
{
    z-index: 3;
}

一个有效的jsFiddle 演示