Skip to main content

Forums

This topic contains 1 reply, has 2 voices, and was last updated by  chirukan 2 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #281241

    pablobernabeu
    Participant

    Hello,

    I would like to ask for help with a CSS addition to keep the menu items fixed on the top of the site, in a functional way. The site is: http://wp.lancs.ac.uk/prospr/

    I’ve tried with the code from this site, namely:

    .site-header {
    position: fixed;
    width: 100%;
    z-index: 1000;
    }

    .main-content {
    padding-top: 50px; /* adjust this to match the height of your header */
    }

    That almost worked. The problems were that:

    (1) the header image was made ‘sticky’ too (covering up nearly the whole site),

    (2) the menu was left transparent rather than opaque (thus the text in pages can be seen behind).

    I would greatly appreciate any advice for these issues. Thanks a lot,

    Pablo

    #281463

    chirukan
    Participant

    Hey, the code itself looks buggy.

    Take out “position: fixed” to made header not sticky first of all.

    One more simple advice from my side is that, change the menu location from header to secondary menu location like below to the header and above to the content, that will help you solve the issue I believe. You can check secondary menu location of this website (https://noxforpc.com/) just for an idea and please note that I haven’t made the menu sticky as I serve ads and that stick menu will cover the ads and that will create issues, So.

    Thanks & Regards.
    Chirukan.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star