Making a simple tooltip with only HTML and CSS

Question

I want my tooltip element (the ) to appear above everything on the page but still relative to its parent element (the

Answer 1

I found a method to make a very lightweight tooltip with no JS!

HTML:

Send reminders?
this is the tooltip alshdgwh gahfguo 
wfhg fghwoug wugw hgrwuog hwaur guoarwhg rwu

CSS: (must be in this order)

.ht:hover .tooltip {
    display:block;
}

.tooltip {
    display: none;
    color: red;
    margin-left: 28px; /* moves the tooltip to the right */
    margin-top: 15px; /* moves it down */
    position: absolute;
    z-index: 1000;
}

Totally awesome and props to this guy!