Blogger Trick: How To Remove Banner Border (for Courtney)

Courtney from BeautyandtheBride just installed my 3 Column Minima (Wide) template and had the following question:

I am in the midst of uploading the Minima wide three column template you created for blogger (Thank you!) and have a question. I have a banner/image that I would like to install on my blog. In the fonts and colors area I clicked on the border color to white, so there would not be any lines around my image, but one gray line still remains. Is there any way to get the gray line out from around my image? Thank you again for a cool template! ~ Courtney

OK, Courtney.  This is pretty simple and I'm  going to break it down in 4 easy-peasy steps.

First, let's establish our goal: we want to remove the double border around the top banner. See the "before" and "after" photos below. If you need more clarity simply click on images to embiggen.

 

 This is pretty cinchy! Here we go:

#1

First of all, head to your Blogger dashboard and go to Layout → Fonts and Colors (see above).


#2

 

In the colors box on the left scroll down to "Border Color" and change the border from "Pink" to "White".  (See above).

Then hit "Save Changes".

In some templates this should do the trick. But Blogger is funny and sometimes there's a little code monkey running around in your code that will only allow you to remove just one border outline (not both).  I don't know how it got there and I don't know how to get rid of it. However, I can tell you how to remove the second border.  But I have to tell you now: you're gonna have to go into the HTML code. But don't panic! We can do this! Here we go:

#3

Go to Layout → Edit HTML (see above)

Scroll down until you see the following code:

#header-wrapper {
width: 1000px;
margin:0 auto 10px;
border:1px solid #cccccc;     ← CHANGE THIS VALUE
}

#4

 

Change the part where the hexidecimal color code* (aka HEX) says #cccccc (gray) to #ffffff (white). (See above). 

#header-wrapper {

width: 1000px;
margin:0 auto 10px;
border:1px solid #ffffff;       ← TO THIS VALUE
}

And voila! The color is now white, blending in with the background of your template. (See above).

Hit "Save Changes" and you're good to go!

------
* FYI the HEX code for black is #000000 and here's a table of other color codes.