Forums

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

Home Forums CSS [Solved] CSS Help WIth Sticky Welcome Message

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #234706
    Amol
    Participant

    Hello Everyone,

    I been working on one of my new website @
    http://workstation.staging.wpengine.com/ I been working on creating STicky Welcome message for the visitor. After the welcome message was implemented the user has problem to click the primary navigation menu. The code for the same is as follows.
    Style.css

    /* Sticky Message
    —————————————————————————————————- */

    .sticky-message {
    background-color: #333;
    font-size: 16px;
    opacity: 0;
    padding-bottom: 20px;
    padding-top: 20px;
    position: fixed;
    text-align: center;
    width: 100%;
    z-index: 999;
    }

    .sticky-message {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    }

    .sticky-message.reveal {
    opacity: 1;
    }

    .sticky-message,
    .sticky-message a:hover,
    .sticky-message p {
    color: #fff;
    }

    .sticky-message a {
    color: #999;
    }

    .sticky-message p:last-child {
    margin-bottom: 0;
    }

    Thanks Everyone for taking your time to go through this.

    #234707
    Atelierbram
    Participant

    Maybe try moving the z-index like so:

    .sticky-message {
      /* stuff */
      opacity: 0;
      z-index: -1;
    }
    .sticky-message.reveal {
      /* stuff */
      opacity: 1;
      z-index: 999;
    }
    
    #234708
    Amol
    Participant

    @Atelierbram

    Thanks for taking time to look into my problem.
    it worked as miracle.

    Thanks,
    Amol

    #234709
    Atelierbram
    Participant

    it worked as miracle.

      /* CSS = magical stuff */
    

    ;) , you’re welcome

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