Hola

Soy nuevo en este mundillo, y debido a la curiosidad que me han causado unos amigos sobre la programación web en HTML5, en un acto de valentía he estado documentándome. De esta forma he llegado a esta página y he estado siguiendo el curso (me ha encantado y voy a continuar con el resto de materias).
Bueno, al tajo. La cosa es que para practicar estoy intentando clonar una antigua página de estos "amigos" en HTML5. Y la cosa es que encuentro separaciones entre los objetos (en este caso imágenes) que no sé como quitar. He intentado modificar el estilo, pero parece que no es eso

img {
border-top-width:0px;
border-bottom-width:0px;
border-left-width:0px;
border-right-width:0px;
padding: 0px 0px 0px 0px;
border-color: black;
}

El código referente a las imágenes (que conformarán una botonera) es el siguiente:
<section>
<img src="imagenes/botonUP.gif" alt="BotonUP"><br>
<img src="imagenes/boton1.gif" alt="Boton1"><br>
<article><img src="imagenes/boton2.gif" alt="Boton2"></article>
<article><img src="imagenes/boton3.gif" alt="Boton2"></article>
</section>

Y la cosa es que el resultado es éste (he quitado el color de fondo para apreciarse mejor)
SeparacionImg.JPGSeparacionImg.JPG

No sé si se verá (perdonad mi incultura en foros)

Si consideráis que debo realizar mis preguntas en otro tema o area, comentadme por favor