WordPress.org

Ready to get started?Download WordPress

Forums

Expound
[resolved] boarder around content panel (7 posts)

  1. backtogeek
    Member
    Posted 1 year ago #

    Could someone tell me what needs to be changed to add a 1 or 2px boarder around the main content window, with the back ground being mostly white I am using the blend is not as good.

    It would be good to be able to have a black or grey boarder around the main window.

  2. Konstantin Kovshenin
    Member
    Theme Author

    Posted 1 year ago #

    Hi! You can add a border with the following CSS:

    #page { border: solid 2px black; }

    Hope this helps!

  3. backtogeek
    Member
    Posted 1 year ago #

    That did the trick thanks however with 1 issue, I have also used the example you gave to make the header transparent and the boarder goes around the header too which looks wrong, is there any way to do this so it is just from the menu down over?

  4. Konstantin Kovshenin
    Member
    Theme Author

    Posted 1 year ago #

    In that case you'd just use a different container for the border, perhaps:

    .site-main {
        box-sizing: border-box;
        border-left: solid 2px black;
        border-right: solid 2px black;
        border-bottom: solid 2px black;
    }
    
    #site-navigation {
        border-top: solid 2px black;
    }

    Hope that does the trick!

  5. backtogeek
    Member
    Posted 1 year ago #

    Thats the trick :) Thanks.

  6. backtogeek
    Member
    Posted 1 year ago #

    Spotted a problem,

    With the changes in place above the 4th featured video goes under the 3rd and the side bar goes right to the bottom of the page.

    Even with just border-right: solid 1px red; this happens, it is fine if I only use top and bottom.

    I tried changing .site-main { width: 100%; } to a few different settings but obviously that throws everything out.

    I suspect I need to reduce padding somewhere but I cannot find out where.

    Thanks.

  7. Konstantin Kovshenin
    Member
    Theme Author

    Posted 1 year ago #

    You should try and add some extra width to the whole page, like so:

    #page { width: 1028px; }

    Not sure how that will affect the responsive layout, you'll probably need to add the same amount to the CSS media queries as well.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.