Создание простых тултипов с помощью css.
Пример тултипа на css
div.tooltip {
position: relative;
display: inline-block;
padding: 10px;
min-height: 30px;
min-width: 100px;
margin-right: 30px;
text-align: left;
background: #564E5F;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
-icab-border-radius: 5px;
border-radius: 5px;
color: #fff;
margin: 15px 0;
}
div.tooltip:before, div.tooltip:after{
content:'';
position:absolute;
}
div.tooltip:before{
left: 37%;
bottom: -5px;
width: 0px;
height: 0px;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-top: 15px solid #564E5F;
}
Комментарии
0Нашли ошибку или хотите дополнить материал?