If you’re using the Twenty Sixteen theme for your WordPress website and looking to get rid of the black border around the edges, then this is the tutorial for you. It’s some simple code that you can paste into your style.css file and it will be gone!
In my WordPress design tutorials, Step 1 is always to create a child theme. If you have one already – then great – bypass this step. But, if you don’t have a child theme, you need to stop right now and read my post – How to make a child theme & why you need one. In a nutshell, a child theme allows you to create a safe place to put all your design changes so you never risk breaking your theme and your edits are never lost.
Follow the steps in that post to create the child theme, and then you can come back here and continue on with this tutorial. Once you have created your child theme you go to Appearance > Editor to find the style.css file and that is where you put all your code in, or you can access it through FTP.
And here’s the code you need to use to get rid of that pesky black border that surrounds the Twenty Sixteen theme. I usually don’t recommend using overflow:hidden on something as large as the site-inner selector, but without it, the black border disappears and then the page scrolls horizontally, which is NEVER a good thing. So, this is the code you need. Place it in your child theme and say goodbye to the border!
Below is my Twenty Sixteen child theme with and without the black border using this code.