removing space between blocks

Question

I make some block with image and i want put their in one line inside each other and have some space between them . I expect this to be horizontal and less inner space. I want to removing space between blocks.

 /* remove spacing between middle columns */ .row.no-gutter [class*='col-']:not(:first-child):not(:last-child) { padding-right:0; padding-left:0; } /* remove right padding from first column */ .row.no-gutter [class*='col-']:first-child { padding-right:0; } /* remove left padding from first column */ .row.no-gutter [class*='col-']:last-child { padding-left:0; } /* only for column content visible */ .col-md-1>div {background-color:#ddd;}

 <div class="container-fluid"> <div class="row no-gutter" > <div class="col-md-6" style="background-color:#d9eaf2;color: #6666ccff;font-family: Roboto,Tahoma,Helvetica,sans-serif;font-size: 14px;margin-bottom: 6px;">i expect this to be horizontal and less inner space.placing it above head in wordpress theme just after head </div> <div class="col-md-1 align-middle"><img class="aligncenter size-full wp-image-2940" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> <div class="col-md-1 align-middle"><img class="aligncenter size-full wp-image-2947" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> <div class="col-md-1"><img class="aligncenter size-full wp-image-2946" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> <div class="col-md-1"><img class="aligncenter size-full wp-image-2945" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> <div class="col-md-1"><img class="aligncenter size-full wp-image-2944" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> <div class="col-md-1"><img class="aligncenter size-full wp-image-2942" src="https://cdn0.iconfinder.com/data/icons/Social_Network_Icons_gloss/350/Facebook-px.png" alt="" width="28" height="28" /></div> </div> </div>

Answer 1

I'm not sure that I understood your problem, but maybe you just need to wrap your divs with the facebook logo in an another div, and add a display:flex;

Check this example and let me know if it answer your question :)

https://codepen.io/mdubus/pen/NeQOKe