[Resolved] CSS code for sitebar widget

Home Forums Support [Resolved] CSS code for sitebar widget

Home Forums Support CSS code for sitebar widget

  • This topic has 6 replies, 2 voices, and was last updated 2 months ago by Leo.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #2001919
    Robin

    Hi!

    Is it possible, with CSS code, to give a bit of color to the top line of the widgets in my right side bar?

    This is my website -> https://www.hardloopbaas.nl/

    I am looking to create something like on this website -> https://www.hardloopzone.nl/loopband-voor-thuis/

    In the widgets on the right side bar you can see a small light blue line on the top of the widget box.

    Hopefully this is possible and someone can help.

    Thanks in advance!

    Kind regards,

    Robin

    #2001970
    Leo
    Staff
    Customer Support

    Hi Robin,

    Try this CSS:

    .sidebar .widget {
        border-top: 6px solid #09c;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Let me know if this helps πŸ™‚

    #2002020
    Robin

    Hi Leo,

    Thanks for your reply!
    Unfortunately it doesn’t work :(.

    I added it via customize > extra CSS. Should be the right way?

    #2002036
    Robin

    Hi Leo,

    It worked! Thanks πŸ™‚
    For some reason I had to place it further up in the ‘Extra CSS’ column.
    I would like to give the line the same color as the blue in my logo.
    The blue in my logo is color #0366d6. Do you know what color that is for CSS code?

    Thanks πŸ™‚

    #2002042
    Leo
    Staff
    Customer Support

    For some reason I had to place it further up in the β€˜Extra CSS’ column.

    That means you have some syntax error in your previous CSS which stops the code below from working.

    I would like to give the line the same color as the blue in my logo.
    The blue in my logo is color #0366d6. Do you know what color that is for CSS code?

    You just have to replace #09c in my code.

    #2002058
    Robin

    Ah, it is that easy! I thought colors always had 6 numbers after the #.
    I was confused.

    Thanks a lot! It worked πŸ™‚

    #2002107
    Leo
    Staff
    Customer Support
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.