请稍等 ...
×

采纳答案成功!

向帮助你的同学说点啥吧!感谢那些助人为乐的人

老师,这个wrapper用display:inline-block;的作用是什么呢。如果不加,好像效果还不一样,会把close顶下去

正在回答 回答被采纳积分+3

3回答

ustbhuangyi 2017-07-06 00:56:53

贴一下具体的代码?

1 回复 有任何疑惑可以回复我~
  • 就是二期代码header-detail组件.detail-wrapper
          display: inline-block这句删掉就会把icon-close顶下去,不知道啥原因
    回复 有任何疑惑可以回复我~ 2019-09-26 16:29:44
PuzzleLing 2018-12-27 00:13:03

我遇到了同样的问题,是子元素的margin-top影响了父元素,具体参考https://blog.csdn.net/hahhahahaa/article/details/80676873

但至于为什么display:inline-block能起作用,我也解释不清楚


0 回复 有任何疑惑可以回复我~
提问者 我是路飞qzh 2017-07-06 12:19:10

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">   

    <title>Sticky Footer布局</title>

</head>

<style>

    .v_sticky {

        position: fixed;

        top: 0;

        left: 0;

        height: 100%;

        width: 100%;

        background-color: rgba(7,17,27,0.7);

        overflow: auto;

    }

    .v_wrapper {

        display: inline-block;

        min-height: 100%;

        width: 100%;

    }

    .v_wrapper:after{

        display: block;

        height: 0;

        line-height: 0;

        content: "."

        visibility: hidden;

        clear: both;

    }

    .v_wrapper .v_main {

        margin-top: 64px;

        padding-bottom: 64px;

    }

    .v_close {

        text-align: center;

        margin: -64px auto 0 auto;

    }

    p {

        padding: 0 10px 0 10px;

    }

</style>

<body>

    <div>

        <div>

            <div><p>文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文文字文</p></div>

        </div>

        <div>关闭</div>

    </div>

</body>

</html>


老师,代码如上,效果图如下  

.v_wrapper 为何要用display:inline-block 这个属性嘞   =v=

https://img1.sycdn.imooc.com/szimg//595db9990001c9e910510848.jpg

https://img1.sycdn.imooc.com/szimg//595db9990001034a11240825.jpg


0 回复 有任何疑惑可以回复我~
  • 提问者 我是路飞qzh #1
    哎呀,这个代码为何变成了这样
    回复 有任何疑惑可以回复我~ 2017-07-06 12:19:35
  • 我也有这样的疑问,感觉是垂直外边距合并的问题。
    回复 有任何疑惑可以回复我~ 2017-09-22 20:48:20
问题已解决,确定采纳
还有疑问,暂不采纳
意见反馈 帮助中心 APP下载
官方微信