Показать сообщение отдельно
  #2 (permalink)  
Старый 04.09.2017, 14:50
Кандидат Javascript-наук
Отправить личное сообщение для AlexTrader Посмотреть профиль Найти все сообщения от AlexTrader
 
Регистрация: 23.12.2016
Сообщений: 121

Пытался так:
<span class="left-sort-tooltip" data-tooltip="Тултип">Инфо</span>

.left-sort-tooltip {
        cursor: help;
    }

    .left-sort-tooltip::after {
        background: white;
        box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
        color: gray;
        content: attr(data-tooltip); 
        opacity: 0; 
        padding: 10px;
        position: absolute;
        transition: all 0.4s ease-in-out; 
        font-family: Helvetica, Arial, sans-serif;
        font-size: 9px;
        width: 100%;
    }

    .left-sort-tooltip:hover::after {
        opacity: 1; 
        visibility: visible;
    }

    .left-sort-tooltip:hover::before {
        content: "";
        left: 30%;
        position: absolute;
        z-index: 99;
        border: 20px solid transparent;
        border-right: 15px solid white;
    }
Ответить с цитированием