Difference between revisions of "Template:Tt"
From Detective Conan Wiki
(Minor chevron fix, it won't shift out of position when the tooltip gets too large) |
m |
||
| Line 30: | Line 30: | ||
/* Container appear above target */ | /* Container appear above target */ | ||
.tt-container-above { | .tt-container-above { | ||
| − | bottom: | + | bottom: calc(100% - 2px); |
transform: translate(-50%, 3px); | transform: translate(-50%, 3px); | ||
} | } | ||
| Line 36: | Line 36: | ||
/* Container appear below target */ | /* Container appear below target */ | ||
.tt-container-below { | .tt-container-below { | ||
| − | top: | + | top: calc(100% - 2px); |
transform: translate(-50%, -3px); | transform: translate(-50%, -3px); | ||
} | } | ||
| Line 70: | Line 70: | ||
/* When tooltip is above */ | /* When tooltip is above */ | ||
.tt-container-above .tt-chevron { | .tt-container-above .tt-chevron { | ||
| − | top: calc(100% - | + | top: calc(100% - 3px); |
border-width: 9px 9px 0 9px; | border-width: 9px 9px 0 9px; | ||
border-color: #fff transparent transparent transparent; | border-color: #fff transparent transparent transparent; | ||
| Line 77: | Line 77: | ||
/* When tooltip is below */ | /* When tooltip is below */ | ||
.tt-container-below .tt-chevron { | .tt-container-below .tt-chevron { | ||
| − | bottom: calc(100% - 2px) | + | bottom: calc(100% - 2px); |
border-width: 0 9px 9px 9px; | border-width: 0 9px 9px 9px; | ||
border-color: transparent transparent #fff transparent; | border-color: transparent transparent #fff transparent; | ||
Template documentation