WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Custom bar above and below navigation (6 posts)

  1. designbysue
    Member
    Posted 5 months ago #

    Currently there is a horizontal line (bar) above and below my navigation area. I am wondering if there is any way to replace this line with a custom line, something decorative that I would create and could save as a jpg or png?

    Thanks
    Sue

  2. DMBarber
    Member
    Posted 5 months ago #

    You will be able to do this by altering your child theme stylesheet. If you are not using a child theme, directions are located here. To better answer your question it is easiest to see your website. Can you give us a link to your site please?

  3. designbysue
    Member
    Posted 5 months ago #

  4. DMBarber
    Member
    Posted 5 months ago #

    Your border above and below your navigation bar is controlled by your css selector:

    .main-navigation ul.nav-menu,
    .main-navigation div.nav-menu > ul {
    border-bottom: 1px solid #004667;
    border-top: 1px solid #004667;
    /** other elements here **/
    }

    To change the way they look add this to your child theme stylesheet (replace [CAPITAL] with your own styles - more here about styling borders):

    .main-navigation ul.nav-menu,
    .main-navigation div.nav-menu > ul {
    border-bottom: [WIDTH] [LINETYPE] [COLORCODE];
    border-top: [WIDTH] [LINETYPE] [COLORCODE];
    }

    IF you want to remove them add this to your child theme stylesheet:

    .main-navigation ul.nav-menu,
    .main-navigation div.nav-menu > ul {
    border: none;
    }

    If you want to use a custom image, that is not fully accepted by all browsers, but here is a good write-up about using them.

    I hope this helps.

  5. designbysue
    Member
    Posted 5 months ago #

    Thank you for such a complete answer - exactly what I needed! I have advised my client accordingly and hope she stays with the line as this looks like it might be opening a pandora's box when it doesn't work in all browsers.

    Really appreciate your taking the time to help out.

    Sue

  6. DMBarber
    Member
    Posted 5 months ago #

    My pleasure. All the best.

Reply

You must log in to post.

About this Topic

Tags

No tags yet.