我似乎无法让我的药片在小屏幕上工作。他们可以在普通屏幕上标记内容,但是一旦我将屏幕变小,这些药片就会无法点击。
我不知道问题所在。
此外,如果我只有药片,那么它会标记但是一旦它在容器中,那么它就不会被标记。
<div class="container-fluid">
<div class="row" style="margin-top: 1em; border: 2px dashed lightgreen">
<div class="col-md-8">
<div class="row">
<div class="col-md-3" style="text-align: center; border: 2px dotted purple"><img src="/images/video-thumbnails/ice.jpg" class="songThumbnail">
</div>
<div class="col-md-5" style="border: 2px dotted purple">
TEXT TEXT TEXT</div>
<div class="col-md-4 col-xs-12">
TEXT TEXT TEXT
</div>
</div>
<div class="row">
<div class="col-md-12" style="margin: 1em;">
<img src="/images/icons/piapro.png" class="favicon"> <a href="http://piapro.jp/t/O28F">ice - オケ</a> <span class="whisper">(karaoke)</span>
</div></div>
</div><div class="col-md-4" style="border: 1px solid red; float: right;">
<ul class="nav nav-pills">
<li class="active"><a data-toggle="pill" href="#niconico">Niconico</a></li>
<li><a data-toggle="pill" href="#youtube">YouTube</a></li>
<li><a data-toggle="pill" href="#soundcloud">SoundCloud</a></li>
</ul>
<div class="tab-content" style="text-align:center;">
<div id="niconico" class="tab-pane fade in active">
<p><div class="embed-responsive embed-responsive-16by9" ><script type="text/javascript" src="http://ext.nicovideo.jp/thumb_watch/sm28116292"></script><noscript><a href="http://www.nicovideo.jp/watch/sm28116292">【ニコニコ動画】【Faeri】ice【歌ってみた】</a></noscript>
</div></p>
</div>
<div id="youtube" class="tab-pane fade">
<br>
<strong>日本語 | Japanese</strong><br>
<br>
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="http://www.youtube.com/embed/JOd9cunyWAg"></iframe>
</div>
<br>
<strong>英語 | English</strong><br>
<br>
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="http://www.youtube.com/embed/mCkHvttcSoE"></iframe>
</div>
</div>
<div id="soundcloud" class="tab-pane fade">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" width="100%" height="600" scrolling="yes" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/244661025&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true"></iframe>
</div>
</div>
</div>
<br>
<p>TEXT TEXT TEXT</p>
</div></div>
答案 0 :(得分:0)
再次重新实现页面并摆弄列/行之后,我意识到是的z-index案例。哎呀。直到我改变了div的bg颜色才明显。
我最终为媒体侧边栏编写的代码是:
<div class="col-md-4 col-lg-4 pull-right" style="background-color: #99CCFF; border: 3px dotted red; display: block; z-index: 1; margin-top: 1em;">
<!-- All that jazz and other stuff -->
</div>
它似乎像我想的那样工作。希望将来不会打扰我。 @NathanielFlick,对于提供代码没有多大帮助道歉,但我真的很感谢你花时间回复我。谢谢!