Image spacing with HTML5

Asked

Viewed 172 times

2

When I put an image it automatically comes with a spacing above and below the image of approximately 5px, I wonder how to remove this spacing I tried to put border: 0px and margin: 0px and did not solve.

<figure>
  <figcaption>Curso HTML5</figcaption>
    <img src="imagens/html5.png" alt="Imagem do html5" title="Curso html5"> 
</figure>
html5

1 answer

2

These margins are added by the browser, depending on it. For example Google Chrome adds:

figure {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}

To remove this margin, simply add:

figure {
    margin: 0;
}

See the examples below, with and without the margin removed:
http://jsfiddle.net/uepswk2q
http://jsfiddle.net/uepswk2q/1/

  • 2

    So I did that and did not resolve continued with the margin above and below more I managed to solve like this... figure { width: 960px; height: 498px; margin: 0; } Ai disappeared the margins, Thanks!

Browser other questions tagged html5

You are not signed in. Login or sign up in order to post.