Создание складного div с вложенными ссылками/кнопками с помощью начальной загрузки ⇐ CSS

[Anonymous]

Я хотел бы создать складную «карточку» с рядом кнопок в нижней части складного элемента div. Немного похоже на твиттер-карточку с рядом кнопок в нижней части. В этом примере сама карточка кликабельна (а мне бы хотелось, чтобы она была разборной). В моем случае я хотел бы, чтобы с правой стороны была небольшая стрелка, указывающая, сложен или развернут складной элемент div. Более того, я хотел бы написать несколько абзацев внутри сворачиваемого элемента div (над рядом кнопок).
Я пробовал несколько вещей, но не понял, как это сделать. Это не должно быть слишком сложно, но я не очень хороший программист, поэтому буду очень признателен, если кто-нибудь поможет.
Я уже пробовал следующее с помощью начальной загрузки

Код: Выделить всё

.block {
position:relative;
}

.block .overlay {
position:absolute;
left:0; top:0; bottom:0; right:0;
}

.block .inner {
position:relative;
pointer-events: none;
z-index: 1;
}

.block .inner a {
pointer-events: all;
}

Код: Выделить всё

[url=#collapseExample][/url]

This entire box is collapsible.
But somehow the arrow on the right side does not turn
[url=https://duckduckgo.com/]I'm a clickable link that could also have been a button[/url]




Exra information about the thing written above.

К сожалению, стрелка справа не нажимается и не вращается.

Подробнее: https://stackoverflow.com/questions/708 ... -bootstrap