• russinternational

    (@russinternational)


    Hi all,

    Just got a slight issue with the header. I am trying to get the text for the menu to be ‘centre’ with the organisation logo. This is so the header size stays the same when the sticky header is formed.

    I presume it is a conflict with my custom CSS, but after a long time trying to edit certain parts, I cannot get the menu to move!

    I’ve copied all of the CSS below. Thanks ??

    /* Adjust Menu Text Settings  */
    .navbar .nav > li > a, .navbar .nav > li > a:first-letter,
    .sticky-enabled .navbar .nav > li > a, .sticky-enabled .navbar .nav > li > a:first-letter,
    .navbar .nav > li.current-menu-item > a,
    .navbar .nav > li.current-menu-ancestor > a {
    display:        inline;
    color:          #7b0000;
    font-family:    century gothic;
    font-size:      1.5em;
    padding:        0px 5.5px;
    font-weight: bold;
    }
    
    /*  Reposition Navbar Box - change top/left as needed */
    .navbar.notresp .navbar-inner {
    position:       relative;
    top:            -10px;            /* Adjust using -1px move Up, 1px move Down, 0px No change  */
    left:           0%;             /* Adjust using -1% move Left, 1% move Right, 0% No change  */
    }
    
    /* Edit background colour */
    body, #main-wrapper, header.tc-header, footer#footer .colophon {
    background-color: #EEEDEE;
    margin-top:     0px;
    margin-bottom:  0px;
    padding:        05px 0px;
    }
    
    /*  Adjust Navbar Colour      */
     .tc-header, .navbar.notresp .navbar-inner  {
    background-color:   #7b0000;                                       /* Change red */
    background-image: linear-gradient(to bottom, #EEEDED, #EEEDED);      /* Change white, pink */
    background-image: -webkit-linear-gradient (top, white, pink);   /* Change white, pink */
    background-repeat: repeat-x;
    border:           -1px solid pink;                               /* Change pink */
    border-radius:    4px 4px 4px 4px;
    box-shadow:       0 px 0px rgba(0, 0, 0, 0.067);
    min-height:       20px;
    padding-left:     20px;
    padding-right:    20px;
    }
    
    /* Remove all Navbar Box colours and shading  */
    .navbar,
    .navbar .navbar-inner,
    .navbar .nav {
        webkit-box-shadow:  none;
        -moz-box-shadow:    none;
        box-shadow:         none;
        filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    }
    
    /* Adjust Menu colors - Hover */
    .navbar .nav > li > a:hover, .navbar .nav > li > a:hover:first-letter {
    color:          #7b0000;
    text-shadow:    none;
    }
    
    /* Adjust Menu colors - Normal */
    .navbar .nav > li > a, .navbar .nav > li > a:first-letter {
    color:          #2a2a2a;
    text-shadow:    none;
    }
    
    /* Adjust colors as needed */
    .footer-widgets {
    background:     none repeat scroll 0 0 #2a2a2a;
    color:          #5a5a5a !important;
    padding-top:    10px ;
    }
    
    footer#footer {
    color: #fafafa!important;
    border-top: 10px solid #7b0000;
    background: #2a2a2a;
    padding: 0;
    }
    
    /*Header Bar */
    header.tc-header {
    border-bottom:  10px solid #7b0000;
    }
    
    /* Make Carousel fade - adapt 5s to required delay */
    .carousel-inner > .item {
    -webkit-transition: opacity 5s ease-in-out ;
    transition:         opacity 5s ease-in-out ;
    }
    .carousel-inner > .next.left,
    .carousel-inner > .prev.right {
    opacity:        1;
    z-index:        1;
    left:           0;
    }
    .carousel-inner > .active.left {
    opacity:        0;
    z-index:        2;
    left:           0;
    }
    .carousel-inner > .active.right {
    opacity:        0;
    z-index:        2;
    left:           0;
    }
    
    /* remove previous/next arrows from home page only */
    .home .carousel-control {
    display:        none ;
    }
    
    /* Change Background, Border, Font/Color as needed  */
    footer#footer .colophon {
    background:     none repeat scroll 0 0 #7b0000;
    border-top:     12px solid #7b0000;
    color:          #7b0000;
    padding:        0;
    }
    
    /* Change Featured Pages Button color  */
    .btn.btn-primary.fp-button {
      color: white;
      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
      background-color: #7b0000;
      background-image: -moz-linear-gradient(top, #2a2a2a, #2a2a2a);
      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7b0000), to(#7b0000));
      background-image: -webkit-linear-gradient(top, #7b0000, #7b0000);
      background-image: -o-linear-gradient(top, #7b0000, #7b0000);
      background-image: linear-gradient(to bottom, #7b0000, #7b0000);
      background-repeat: repeat-x;
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000' , endColorstr='#000000' , GradientType=0);
      border-color: #000000 #00000 #000000;
      border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
      *background-color: #7b0000;
      filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    }
    .btn.btn-primary.fp-button:hover,
    .btn.btn-primary.fp-button:focus,
    .btn.btn-primary.fp-button:active,
    .btn.btn-primary.fp-button.active,
    .btn.btn-primary.fp-button.disabled,
    .btn.btn-primary.fp-button[disabled] {
      color: solid #7b0000;
      background-color: #7B0000;
      *background-color: #7b0000;
    }
    .btn.btn-primary.fp-button:active,
    .btn.btn-primary.fp-button.active {
      background-color: #b04d07 9;
    }
    .btn.btn-primary.fp-button:hover,
    .btn.btn-primary.fp-button:focus,
    .btn.btn-primary.fp-button:active,
    .btn.btn-primary.fp-button.active,
    .btn.btn-primary.fp-button.disabled,
    .btn.btn-primary.fp-button[disabled] {
      color: white;
      background-color: #2a2a2a;
      *background-color: #7b0000;
    }
    .btn.btn-primary.fp-button:active,
    .btn.btn-primary.fp-button.active {
      background-color: #b04d07 9;
    }
    
    /* Remove icon  */
    .page #main-wrapper h1.format-icon:before {
    content:        none;
    }
    
    /* START OF Adjust 3.2 Sticky Header */
    
    /* Remove Transparency */
    .sticky-enabled .tc-header {
     background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
    }
    
    /* Remove Transparency / Add a border */
    .sticky-enabled .tc-header {
     background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
     border-bottom: 10px solid  #7b0000; /* Adjust border|border-top|border-right|border-left & settings */
    }
    
    /* Stop Logo Size Reduction */
    .sticky-enabled .tc-shrink-on .site-logo img {
     height: 70px  !important;
    }
    
    .sticky-enabled .tc-header {
    display:        inline;
    color:          #7b0000;
    font-family:    century gothic;
    font-size:      1em;
    padding:        0px 10px;
    font-weight: bold;
    }
    
    .tc-solid-color-on-scroll.sticky-enabled .tc-header {
     background-color: #EEEDED;
    }
    
    /* END OF Adjust 3.2 Sticky Header */
    
    /*CIRCLE BACKGROUND COLOUR*/
    @media all and (max-width: 768px) {
    .widget-front .round-div {
    border: 94px solid #EEEDEE;
    }
    }
    
    /*STICK NAV BAR SIZE*/
    .nav-collapse .nav {
    float: righ;
    }
    .nav-collapse.tc-hover-menu-wrapper {
        width: 70% !important;
    }
    
    .navbar .nav > li > a, .navbar .nav > li > a:first-letter, .navbar .nav > li.current-menu-item > a, .navbar .nav > li.current-menu-ancestor > a {
        white-space: nowrap;
        line-height: 3em;
    }
    
    /*Adjust Colour around Circles*/
    .round-div {
    display: block;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    position: absolute;
    width: 170px;
    height: 170px;
    z-index: 99;
    -webkit-border-radius: 60px;
    -moz-border-radius: 500px;
    border-radius: 900px;
    border: 104px solid #EEEDED;
    border-image: none;
    top: -67px;
    left: -54px;
    }
    
    /*Sticky Scroll Background*/
    .tc-solid-color-on-scroll.sticky-enabled .tc-header {
     background-color: #EEEDED;
    }
    
    .carousel-inner {
    top:20px;
    box-shadow: 0px 0px 5px 1px #000000;
    
    }

    Thanks again.

Viewing 3 replies - 1 through 3 (of 3 total)
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Menu Position Problem’ is closed to new replies.