[html]<style>
.image-row {
            display: flex;
            align-items: center;
            gap: 5px;
        }
        .image-container {
            position: relative;
            width: 60px;
            height: 80px;
            transition: margin 0.3s ease-in-out;
        }
        .image-container img {
    width: 100%;
    height: 100%;
    cursor: pointer;
    object-fit: cover;
    border-radius: 10px;
    z-index: 6;
    position: relative;
        }
        .image-container .charsearch-box {
    position: absolute;
    left: 20px;
    top: 0;
    width: 200px;
    height: 80px;
    padding: 5px 5px 5px 40px;
    background: linear-gradient(to right, #c8c7c7, #e4e2e2);
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    font-size: 12px;
    border-radius: 0 10px 10px 0;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

        .image-container:hover {
            margin-right: 158px;
        }
        .image-container:hover .charsearch-box {
            opacity: 1;
            transform: translateX(0);
        }
</style>

<div class="image-row">
        <div class="image-container">
            <img src="https://i.pinimg.com/736x/4c/d5/d0/4cd5d0f1756c9960d62c376cae1d71b1.jpg" alt="Image 1">
            <div class="charsearch-box">
                <a href="#">Имя Фамилия</a>
                <p>Описание</p>
            </div>
        </div>
        <div class="image-container">
            <img src="https://i.pinimg.com/736x/4c/d5/d0/4cd5d0f1756c9960d62c376cae1d71b1.jpg" alt="Image 2">
            <div class="charsearch-box">
                <a href="#">Имя Фамилия</a>
                <p>Описание</p>
            </div>
        </div>
        <div class="image-container">
            <img src="https://i.pinimg.com/736x/4c/d5/d0/4cd5d0f1756c9960d62c376cae1d71b1.jpg" alt="Image 3">
            <div class="charsearch-box">
                <a href="#">Имя Фамилия</a>
                <p>Описание</p>
            </div>
        </div>
    </div>[/html]

Подпись автора

Текст Текст Текст