css - Bootstrap（在 Laravel 上） - 标题下拉列表在一页上变得透明

Question

我尝试布局的其中一个页面似乎有问题。我实现了 FullCalendar 并将其添加到我的一个页面/视图中，我现在注意到我的标题下拉列表覆盖在日历开始的顶部 - 下拉列表不是不透明/强制覆盖底层内容，例如它在所有其他页面上。附件是正在发生的事情的例子。

有任何想法吗？如果我应该发布我的 CSS，请告诉我。这是 FullCalendar 和 Bootstrap 的默认设置，没有任何修改。

这是应用于它不是在“上方/之上”绘制的内容的视图 HTML/类：

@section('content')
@include('layouts.headers.cards')
<div class="container-fluid mt--7"> 
    <div class="row">
        <div class="col">
            <div class="card shadow">
                <div class="card-header border-0">   
                        <div class="col-14">
                            <div id='calendar'></div>  
                        </div>
                </div>
            </div>
        </div>
    </div>
    @include('layouts.footers.auth')
</div>
@endsection

标签： csstwitter-bootstrapdropdownopacity

Answer 1

#calendar{
  z-index: 999999;
  position: relative;
} 

<< 那应该解决它！

阅读：https ://www.w3schools.com/cssref/pr_pos_z-index.asp