鍍金池/ 問(wèn)答/HTML/ 為什么沒(méi)有設(shè)置margin-right,但是顯示有間距?

為什么沒(méi)有設(shè)置margin-right,但是顯示有間距?

問(wèn)題產(chǎn)生可能和用了 table-cell 有關(guān)。我把中間文字部分寬度設(shè)置到很大 10000px。就好了...

參考了一個(gè)博主的文章,很棒。

-----------原問(wèn)題--------

沒(méi)有設(shè)置右邊margin,但是莫名右邊空出來(lái)一截...求助

clipboard.png

css

#timeline {
    width: 100%;
    position: relative;
    list-style: none;
    padding: 0;
    a {
        text-decoration: none;
    }
    .listing {
        background: $white;
        box-shadow: 0px 6px 12px 0px rgba(63,62,57,0.06);
        border-radius: 8px;
        padding: 28px;
        margin-bottom: 20px;
        position: relative;
        z-index: 2;
        display: table;
        width: 100%;
        img, .info, .job_type {
            display: table-cell;
            vertical-align: middle;
            font-size: 14px;      
            color: $t2;
        }
        .images_wrapper {
            width: 64px;
            border-radius: 100%;
            background: $background;
            overflow: hidden;
            img {
                width: 100%;
                border-radius: 100%;
                display: block;
            }
        }
        .info {
            line-height: 20px;
            width: 520px;
            padding-left: 28px;
        }

    }
}
回答
編輯回答
擱淺

<div class="images_wrapper"> 給這個(gè)元素設(shè)置 "display: table;"

因?yàn)槭窃O(shè)置了 img 為 display: table-cell, 不過(guò)就不知你為啥使用這個(gè), 為了垂直居中嗎

2017年6月16日 05:30
編輯回答
入她眼
img, .info, .job_type {
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;      
    color: $t2;
}

這里設(shè)置的 display: table-cell; 什么作用了解一下

2017年7月27日 21:02