creating a sticky horizontal nav bar on a wordpress site

  • Unknown's avatar
    psychicfriends · Member ·

    Hi, I am am trying to fixed a nav bar to the top of the screen on a wordpress site that I am working on for someone.

    I have added this custom css code:

    #header{
    position: fixed;
    background-color: white;
    top: 0;
    height: 92px;
    width: 100%
    /* opacity: 50%; */
    }
    .nav {
    position: fixed;
    top: 95px;
    /* opacity: 50%; */
    }

    /* ul li {
    background-color: none;
    }

    li a {
    background-color: red;
    } */

    #content {
    padding-top: 100px;
    }

    and I can see that the nav bar is responding how I want it to on the preview on the backend of my site. I have published these changes on the backend but it is having no effect on the front end of my website… what am i doing wrong???

  • csabarakasz · Staff ·

    Hi there,

    Would you mind providing your site URL, so we can assist you the best way?

    Thank you.

  • kokkieh · Staff ·

    Hi there,

    What CSS you need to use depends on the specific theme you’re using for the site, as well as what other CSS has already been added, so we need to be able to see the actual site to help you with this.

    That said, also note the following:

    1) You are posting in the support forums for the hosting provider, WordPress.com. We only provide support for sites hosted on WordPress.com, and themes listed at https://wordpress.com/themes in this forum. If you’re using the open source WordPress software at another hosting provider, you need to contact support for the specific theme you’re using directly for help with this.

    General support for the open source WordPress software is provided by the WordPress.org community at https://wordpress.org/support/forums/

    2) Using CSS to create a fixed navigation bar falls outside of the scope of what we provide in terms of CSS support on WordPress.com. So if the site in question is hosted here on WordPress.com, this isn’t something we can help with.

    https://wordpress.com/support/css-support/

    If support for the specific theme also cannot help you, I suggest you ask in a coding forum like https://wordpress.stackexchange.com/ or https://stackoverflow.com/.

  • The topic ‘creating a sticky horizontal nav bar on a wordpress site’ is closed to new replies.