Topic Resolution: Resolved
  • Closed
  • Jon Green
    Spectator
    March 30, 2016 at 4:12 pm #26044

    Hi,

    Is it possible to either change the bottom border colour of the sticky header or add a shadow too it please? I’d like to make it a bit more defined from the rest of the page when scrolling.

    I think I’d prefer a shadow if possible though.

    Welcome to Paul Green Hi-Fi

    Regards, Jon

    Denzel Chia
    Moderator
    Posts: 2656
    March 31, 2016 at 2:07 am #26085

    Hi,

    Please use the following in Theme Options -> Custom CSS
    It will produce a bottom border.

    .sticky-header {
    border-bottom: 1px solid #f1f1f1 !important;
    }

    You can change #f1f1f1 to other color hex code.

    Thank you

    Jon Green
    Spectator
    Posts: 11
    March 31, 2016 at 12:39 pm #26125

    That’s excellent thank you! 🙂

    Is it possible to have a shadow instead? I’d be interested to see if what it looks like.

    Regards,

    Jon

    Denzel Chia
    Moderator
    Posts: 2656
    April 1, 2016 at 2:09 am #26156

    Hi,

    It’s difficult to make shadow work properly in all browsers.
    You can use this tool http://www.cssmatic.com/box-shadow to generate the css code and put them within above mentioned css code.

    Thank you

    Jon Green
    Spectator
    Posts: 11
    April 1, 2016 at 11:48 am #26166

    Thank you. Works a treat! 🙂

    I have kept the border and shadow in the CSS in case a certain browser does on show the shadow.

    Regards,

    Jon

    Denzel Chia
    Moderator
    Posts: 2656
    April 2, 2016 at 8:19 am #26184

    You are welcome.

    Thank you