react-dynamic-input
Version:
An input that can be replicated with a button, each input has its own state
36 lines (34 loc) • 781 B
CSS
/* Tooltip text */
.dynamicTooltip {
position: relative;
display: inline-block;
}
.dynamicTooltip .dynamicTooltipText {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
width: 120px;
bottom: 100%;
left: 50%;
margin-left: -60px;
position: absolute;
z-index: 1;
}
.dynamicTooltip .dynamicTooltipText::after {
content: " ";
position: absolute;
top: 100%; /* At the bottom of the tooltip */
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: black transparent transparent transparent;
}
/* Show the tooltip text when you mouse over the tooltip container */
.dynamicTooltip:hover .dynamicTooltipText {
visibility: visible;
}