Why not set margin-right, but show spacing?

the problem may be related to the use of table-cell. I set the width of the middle text section to a large 10000px. That"s it.

refers to a blogger"s article , which is great.

-original question-

the margin, on the right is not set, but inexplicably there is a gap on the right. Ask for help

clipboard.png

css

-sharptimeline {
    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;
        }

    }
}
Apr.30,2021

< div class= "images_wrapper" > set "display: table;"

to this element

because img is set to display: table-cell , but I don't know why you use this to center vertically


img, .info, .job_type {
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;      
    color: $t2;
}

learn about the function of the display: table-cell; set here

Menu