Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member
    Join Date
    Aug 2014
    Posts
    2
    Member #
    39890

    Nav style changes when window resized

    I am very much a newbie, so please forgive me if I am not asking this question correctly. I purchased a template, which I have customized, but there is one issue I can't resolve. I changed the navigation so the current page state item would appear in with a different background color #534B64, font color, and with a different border radius, which works fine. But when I view the page and reduce the window size, it appears with the setting in the original template (ex: background color is #393939). I have searched through the css to find where this could be changed, but to no avail. Maybe it has something to do with the javascript, which I know nothing about. Any help would be appreciated. Here is the nav html and the css where I changed the color of the current page button background. Please let me know if I should share a different code snippet.

    <nav id="nav">
    <ul>
    <li class="current_page_item"><a href="index.html">Portfolio</a></li>
    <li><a href="about.html">About</a></li>
    <li><a href="events.html">Events</a></li>
    <nav>
    -------------------------------------------------------------------------------------------

    #nav
    {
    position: absolute;
    right: 0;
    top: 1.25em;
    }

    /*.homepage #nav
    {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    } */

    #nav > ul > li > ul
    {
    display: none;
    }

    #nav > ul
    {
    display: inline-block;
    }

    #nav > ul > li
    {
    display: block;
    float: left;
    text-align: center;
    }

    #nav > ul > li > a,
    #nav > ul > li > span
    {
    display: block;
    padding: 0.70em 1.5em;
    text-decoration: none;
    font-size: 1em;
    font-weight: 400;
    outline: 0;
    color: #595959;
    }


    #nav > ul > li:hover > a,
    #nav > ul > li.active > a,
    #nav > ul > li.active > span
    {
    }

    #nav .current_page_item > a
    {
    background: #534B64; /* color of box surrounding selected page button */
    border-radius: 1px;
    color: #FFF;
    }

  2.  

  3. #2
    Junior Member
    Join Date
    Aug 2014
    Posts
    2
    Member #
    39890
    Nevermind. I found it in a separate .css file for 1000px. Yay!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Tags for this Thread

All times are GMT -6. The time now is 06:15 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com