Set an offset to a block or element??

Question

css

There is a block with images

<div class="col-md-10">
  <img src="http://placehold.it/150x50" alt="advertisement" class="advert" >
  <img src="http://placehold.it/150x50" alt="advertisement" class="advert">
  <img src="http://placehold.it/150x50" alt="advertisement" class="advert">
  <img src="http://placehold.it/150x50" alt="advertisement" class="advert">
  <img src="http://placehold.it/150x50" alt="advertisement" class="advert">
</div>

It has a small indentation at the top and bottom.
How would it be better to set the indents to the images themselves or give the block another class and do it from it??
How it should be - prntscr.com/f82057
Here is an example to make it clearer what I want - https://jsbin.com/xihuwuriku/edit?output
PS It should stretch to full screen.

Answer 1

Set an additional class or id to the block and then perform an action

.col-md-10 #block_name > img {
position: relative;
display: inline-block;
margin-right: 1em;
margin-left: 1em;
} 

#block_name > img:first-child {
margin-left:0;
}
#block_name > img:last-child {
margin-right:0;
}

Or, in your case, flex boxes will help a lot - but this is such a field of uncertainty
. Indents above and below set the #block_name block