The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Show text on :hover with CSS

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #42141

    How can i display text inside a dive when its :hover? and when its not :hover the text hides again?


    You could add a span inside the div with an id then use something like

    #some-element { display: none; }
    #some-div:hover #some-element { display: block; }

    See the CodePen example:

    Kitty Giraudel

    If you want your text to be indexed by search bots, you might want to consider another hiding option than display: none;. Perhaps:

    .visuallyhidden {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px; width: 1px;
    margin: -1px; padding: 0;
    border: 0;

    More on this topic in this article:

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.