WordPress.org

Ready to get started?Download WordPress

Forums

Decode
[resolved] CSS styling advice (3 posts)

  1. Steven Jay Cohen
    Member
    Posted 5 months ago #

    Hi Scott,

    On my site, I've put a colored bar at the top and bottom of the page.
    I'd love to anchor these to the top and bottom of the screen.

    Currently, I have:

    body {
    	border-top: 10px solid #46134f;
    	border-bottom: 10px solid #46134f;
    }

    Any suggestions on how to change it to anchor it?

  2. Scott Smith
    Member
    Theme Author

    Posted 5 months ago #

    body::before {
    content: "";
    border-top: 10px solid #46134f;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
    }

    and likewise for the bottom:

    body::after {
    content: "";
    border-bottom: 10px solid #46134f;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
    }

    Note that the admin bar will cover this up unless you add more CSS to detect and change this, but I'm assuming you won't mind.

  3. Steven Jay Cohen
    Member
    Posted 5 months ago #

    Thank you!

Reply

You must log in to post.

About this Theme

About this Topic