HTML





<div class="wrapper">
    <details>
        <summary>Click me to see more details</summary>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. ut eum perferendis eius. Adipisci velit et similique earum quas illo odio rerum optio, quis, expedita assumenda enim dicta aliquam porro maxime minima sed a ullam, aspernatur corporis.
    </details></div>




CSS

.wrapper {
    display: flex;
    justify-content: center;
    padding: 30px;
}
details {
    max-width: 100%;
    width: 100%;
}
summary {
    background-color: #191a1d;
    cursor: pointer;
    margin-bottom: 15px;
    padding: 15px;
}

Result

Click me to see more details

Lorem ipsum dolor sit amet consectetur adipisicing elit. ut eum perferendis eius. Adipisci velit et similique earum quas illo odio rerum optio, quis, expedita assumenda enim dicta aliquam porro maxime minima sed a ullam, aspernatur corporis.

Back To TIL