Imagen sin borde en entrada

Vamos a conseguir que el borde que tenemos definido para las imágenes no se muestre si no lo deseamos, porque depende para que se usen estas imágenes, esos bordes pueden resultar feos.

Cuando una imagen tiene borde al subirla a una entrada nos puede mostrar hasta dos bordes, el que viene definido en los estilos y que le añadimos manualmente.

Corregiremos esto entrando en el diseño de nuestro sitio y ahí en edición Html, y justo antes de ]]></b:skin> crearemos la clase sinborde simplemente añadiendo el siguiente código:

.post img.sinborde {
border:none !important;
padding:0 !important;
}

Al tener la clase ya creada, ahora en el lugar donde deseemos insertar nuestra imagen sin borde, por ejemplo en una entrada, pondremos:

<img class="sinborde" src="url-imagen"/>

En url-imagen, pondremos la url de la imagen que deseemos mostrar.

Ejemplo de imagen sin borde:


La misma imagen como la inserta por defecto:


Si nos fijamos bien en la segunda, aunque no le tenemos definido el borde, si que lo marca.