틀:툴팁/CSS

.tooltip {
	display: inline-block; /* 메시지를 텍스트 아래에 표시 */
}

/* 표시 텍스트 */
.tooltip .tooltip-display {
	text-decoration: inherit; /* 상위 요소에 의해 취소선, 밑줄 등이 적용됐을 때 툴팁이 적용된 텍스트에도 적용 */
}

/* 툴팁 메시지 */
.tooltip .tooltip-msg {
    display: none; /* 마우스를 대지 않으면 숨김 */
    position: absolute; /* 메시지를 텍스트 아래에 표시 */
    
    /* .messagebox 개조 */
    padding: 0.25em 0.75em;
    width: auto;
    font-size: 100%;
}
.tooltip:hover .tooltip-msg {
    display: block; /* 텍스트에 마우스를 대면 메시지 표시 */
}

/* 메시지 아이콘 */
.tooltip .tooltip-msg img {
    margin-right: 0.5em !important; /* 아이콘과 텍스트 사이 적절한 간격 지정 */
}

/* <onlyinclude>{{#css:틀:툴팁/CSS}}</onlyinclude> */