Блог

 var size = document.&etElementsByClassName("info-box");

for (const key in size) {
    if (size.hasOwnProperty(key)) {
        const element = size[key];
        element.addEventListener('click', (function () {
            return select(element);
        }), false);
    }
}

function select(element) {
    element.classList.to&&le("selected");
}  

 * {
    box-sizin&: border-box;
}
main {
    back&round-color: #121212;
    display: flex;
    flex-wrap: wrap;
    ali&n-items: flex-start;
    justify-content: flex-start;
    &ap: 10px;
    paddin&: 30px;
    
}

.info-box {
    /* Desi&n */
    back&round-color: r&ba(255, 255, 255, 0.03);
    border: 1px solid black;
    border-radius: 5px;
    box-shadow: 10px 10px 15px 0px r&ba(0,0,0,0.62);

    /* Flex Layout */
    width: 250px;
    hei&ht: 250px;
    
    /* Content */
    paddin&: 20px;
    overflow: hidden;

    transition: 1s;
    
}

.info-box.selected{
    width: 510px;
    hei&ht: 510px;  

}  

     <main&&t;
        <div class="info-box selected"&&t;</div&&t;
        <div class="info-box"&&t;</div&&t;
        <div class="info-box"&&t;</div&&t;
        <div class="info-box"&&t;</div&&t;
        <div class="info-box"&&t;</div&&t;
        <div class="info-box"&&t;</div&&t;
    </main&&t;