Как адаптировать краткую новость при помощи css?

.short_video_block{
    height: 180px;
    background: #FFF;
    float: left;
    margin-right: 15px;
    margin-bottom: 24.6px;
}

.short_video_block:nth-child(2n){
    margin-right: 0px;
}

.prev_short_video{
    width: 360px;
    position: relative;
    height: 150px;
    overflow: hidden;
    box-shadow: 0 0 5px;
    border: 1px solid #FFFFFF;
    margin: 14px 10px 7px 0;
}

.prev_short_video img{
    width: 360px;
    min-height: 150px;
}

.title_short_video{
    width: 340px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 600;
    font-style: normal;
    color: #4D556E;
}

.short_video_block:hover > a > .title_short_video{
    cursor: pointer;
    text-decoration: underline;
    color: #313746;
}

.prev_short_video:before{
    position: absolute;
    width: 360px;
    height: 150px;
    top: 0;
    left: 0;
    background: rgba(255,255,255,.2);
    content: '';
}

.short_video_block:hover > a > .prev_short_video:before{
    opacity: 0.2;
}

<div class="short_video_block">
    <a href="{full-link}">
        <div class="prev_short_video">
            <img src="[xfvalue_screen_video]" alt="{title}">
        </div>
        <div class="title_short_video">
            {title limit="50"}
        </div>
    </a>
</div>