为了让我的 facebook 发送按钮的模式显示在所有内容之上,我的页面的 css 出现问题。但是,如果光标在模态上,它显示得很好。当我将光标从模态框移开时,显示看起来是错误的。这是模式上的光标:
这是光标远离模态时的样子:
我现在才到达让所有父元素都具有 css 属性的地方overflow: visible
,以便模态在超出这些元素的边界时不会被切断。但是当鼠标离开模态框时,下方的控件(有来自 Foundation 的按钮、文本字段和图标)会显示在模态框的前面。
如果我可以让 facebook 模式领先于一切而不必担心它,那将是非常棒的,但据我所知,这是不可能的。我已经尝试过 z-index 并且没有得到任何结果,就像我读过的每个有类似问题的人一样。
这是相关区域的周围 html。这是作为集合的一部分呈现的部分的一部分。每个图像底部的大图像是下一部分的一部分,并且在我在这里分享的代码之外:
<div class="row promote_and_stats" style="display: none; overflow: visible">
<div class="eight columns">
<div class="panel radius text-center">
<div class="row"><h6>Promote</h6></div>
<div class="promote_collapse">
<div class="row">
<div class="four columns">
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_send"
addthis:url="<%= url_for(controller: 'things',
action: 'show',
id: f.unique_id.nil? ? f.id : f.unique_id,
only_path: false) %>"
addthis:title="<%= @group.name %> - <%= f.title %> - blablabla.com">
</a>
</div>
<small>Facebook</small>
</div>
<div class="four columns">
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_tweet"
tw:text="<%= @group.name %> - <%= f.title %> - blablabla.com<%= url_for(controller: 'things',
action: 'show',
id: f.unique_id.nil? ? f.id : f.unique_id,
only_path: false) %>">
</a>
</div>
<small>Twitter</small>
</div>
<div class="four columns">
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_email"></a>
</div>
<small>Email</small>
</div>
</div>
<div class="row">
<div class="two columns"><i class="social foundicon-flickr"></i></div>
<div class="ten columns">
<input type="text"
placeholder="<%= url_for(controller: 'things',
action: 'show',
id: f.unique_id.nil? ? f.id : f.unique_id,
only_path: false) %>">
</div>
<div class="four columns">
<a class="small button view_thing_button"
href="<%= url_for(controller: 'things',
action: 'show',
id: f.unique_id.nil? ? f.id : f.unique_id) %>"
target="_blank">View</a>
</div>
</div>
</div>
</div>
</div>
<div class="eight columns">
<div class="panel radius text-center">
<h6>Stats</h6>
</div>
</div>
</div>
任何人都可以就如何解决这个问题提供一些建议吗?谢谢!