Я пытаюсь сделать всплывающие подсказки в чистом css, и я бы хотел, чтобы они были отзывчивыми, то есть они должны плавать внутри и там, где нет места на левой стороне, они должны отображаться справа или сверху или снизу.
Я пытаюсь что-то вроде этого
span {
position: relative;
}
div {
margin: 150px 100px 50px 50px;
border: 1px solid Black;
height: 100px;
}
left,
right,
bottom,
top {
position: absolute;
background: black;
color: white;
max-width: 90px;
}
left {
left: 0;
}
right {
right: 0;
}
bottom {
margin: 0 auto;
bottom: 0;
left: 0;
right: 0;
}
top {
margin: 0 auto;
top: 0;
left: 0;
right: 0;
}<span>
<div>
<top>
TOP
</top>
<bottom>
BOTTOM
</bottom>
<right>
RIGHT
</right>
<left>
LEFT
</left>
</div>
</span>