Bordas Pontilhadas nos Gadgets

Boa Tarde "Little Butterflies" <3 Bom ultimamente venho postando muito pouco por aqui e não posso prometer que vou postar mais ou regularmente porque nem sempre estou com vontade de mexer em códigos HTML, mas sempre que puder trarei tutoriais novos ou que são bem procurados. Caso você tenha algum pedido de tutorial basta deixar um comentário em qualquer postagem do blog.

Hoje eu vim trazer um mini tutorial com o código para bordas pontilhadas na parte internar dos Gadgets do blog, ele é bem simples e se o seu Gadgets já for personalizado é só você incluir o código ao código da sua personalização.

Preview:

Vamos ao Tutorial:

1° Passo: Vá em Modelo > Editar HTML.

2° Passo: Procure por(Usando Ctrl+F): .sidebar .widget {

3° Passo: Cole abaixo de ".sidebar .widget {" o código:

outline-style:dashed;
outline-width: 1px;
outline-color: #000000; /* cor da linha pontilhada */
outline-offset: -3px;

5° Passo: Visualize e confira se esta tudo certinho e depois salve.

Pronto!!! Espero que tenham gostado do efeito e se usarem coloquem os devidos créditos.