Question

我正在使用物化来创建模态，并试图在其中放置可滑动的标签。

正在发生的一件奇怪的事情是，出现了标签页眉，但标签内容根本没有出现。我该如何解决？

这是我的小提琴jsfiddle，请告诉我，这是从文档复制的所有代码

<div id="profession-registration-modal" class="modal">
<div class="modal-content">
    <h4>Register your profession</h4>

    <div class="row">
        <div class="col s12">
            <ul id="tabs-swipe-demo" class="tabs">
                <li class="tab col s3"><a href="#test-swipe-1">Test 1</a></li>
                <li class="tab col s3"><a class="active" href="#test-swipe-2">Test 2</a></li>
                <li class="tab col s3"><a href="#test-swipe-3">Test 3</a></li>
            </ul>
            <div id="test-swipe-1" class="col s12 blue">Test 1</div>
            <div id="test-swipe-2" class="col s12 red">Test 2</div>
            <div id="test-swipe-3" class="col s12 green">Test 3</div>
        </div>
    </div>

</div>
<div class="modal-footer">
    <a href="#!" class="modal-close waves-effect waves-green btn-flat">Agree</a>
</div>

Answer 1

默认情况下，标签内容的高度设置为height: 0px。您可以在CSS中设置它：

div.tabs-content.carousel.carousel-slider {
  height: 200px !important;
}

jsfiddle

实现模式中的选项卡不显示内容

1 个答案: