How to Modify and Delete Borders in Blogger

For those using Blogger with Minima template, you can actually remove or change the borders from the header or sidebar. But if you just simply want to change the color of your borders, the easiest way is through Dashboard --> Design --> Template Designer --> Advanced.


From there you can choose the color you like, or make the color of the border the same as your blog background in order to ‘hide’ them. After that you can press “Apply to Blog”.

To alter other border such as header, you need to go to dashboard --> Design --> Edit HTML, then search for these lines:

/* Header
-----------------------------------------------
*/

#header-wrapper {
margin:0 2% 10px;
border:1px solid $bordercolor;
}

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center; color:$pagetitlecolor;
}

To change the size (height and witdh) of the border, you can insert the following line/s inside the curly brackets of the header-wrapper:

height:140px; (this is for the height)
width:780px; (this is for the width)

Just change the amount of pixel you want for your border.
If you want to remove the border around your image, you can just delete the whole line that i highlight in green (see below).

/* Header
-----------------------------------------------
*/

#header-wrapper {
height:140px;
width:780px;
margin:0 2% 10px;
border:1px solid $bordercolor;
}

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

In the Minima template, the below codes create the border at the bottom of your every widget including the bottom of your main post:

.sidebar .widget, .main .widget {
border-bottom:5px dotted $bordercolor;
margin:0 0 1.5em; padding:0 0 1.5em;
}

If you want your border at the bottom of your sidebar to be different from the border at the bottom of your main post, you can split the above codes like this:

.sidebar .widget {
border-bottom: 3px dashed $bordercolor;
margin:0 0 1.5em; padding:0 0 1.5em;
}

.main .widget {
border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
}

you can change the style of your border to Dots, Solid, Groove, Double, Dashed etc.
If you change the -bottom above to -top, -left, -right, that setting will apply to border only in those areas.

You can actually steal other template's border and add it to your template so that you can have similar border style from the template you taken from.