Question

我正在制作一个活页夹滑块，人们可以在其中对公司进行评论。但是文本不在div之外。我尝试了无数次尝试，但无法按我想要的方式工作。这就是我所拥有的：

https://imgur.com/dfLlUSg

这就是我想要的：

https://imgur.com/f61MFCf

我正在使用“高级自定义字段中继器”字段。

此外，两行文字（图片上方）没有任何空格，我不知道为什么。

这是它的构建方式：

https://imgur.com/MX49WWB

有人可以帮我吗？

这是一些额外的SCSS：

.flipster {
    //margin-top: 75px;
    ul {
        height: 483px !important;
        margin-top: 5px;
        .flipster__item--current article {
            box-shadow: 0px 0px 20px 3px rgba(0, 0, 0, 0.2);
        }
        li {
            &.flipster__item--future {
                .flipster__item__content {
                    //transform: rotate(0) !important;
                }
            }

            &.flipster__item--past {
                .flipster__item__content {
                    //transform: rotate(0) !important;
                }
            }


            article,
            .flipster article {
                padding: 45px;
                width: 460px;
                margin: 10px auto;
                height: 460px;
                background: #fff;
                box-shadow: 0px 0px 20px 3px rgba(0, 0, 0, .1);

                .quote {
                    text-align: center;
                    p {
                        font-size: 32px;
                        text-align: center;
                    }
                }
                .quote-persoon {
                    p {
                        font-size: 18px;
                        color: $oranje;
                        text-align: center;
                        padding: 35px 0 5px 0;
                        display: block;
                    }
                    span {
                        font-size: 16px;
                        width: 100%;
                        display: block;
                        text-align: center;
                    }
                    img {
                        margin: 35px auto 0 auto;
                        display: block;
                        border-radius: 75px;
                    }
                }
            }
        }
    }
    .flipster__button {
        opacity: 1;
        svg {
            color: $oranje;
        }
    }
}

当我重新加载页面时，我可以看到它完全位于div中，但是随后它迅速跳出了

Answer 1

我发现了问题。它在ul.flipster__容器中。有一条css行：空格：nowrap; 不知道为什么会有什么用

Flipster P移至父div之外

1 个答案: