I have searched the web for this one but didn't find anything similar.
Say we have div A and div B. When hover on div A, div b should be visible ON (should look like overwriting) div A and not placed under.
It should appear like only the content of div A has changed to content of div B.
How can this be done in pure CSS and HTML?
#container > div {
display: none
}
#container > div:first-child {
display: block
}
#container > div:hover + div {
display: block
<div id="container">
<div>A</div>
<div>B</div>
</div>
See Question&Answers more detail:os