简体   繁体   English

删除块之间的空间

[英]removing space between blocks

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>

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;我不确定我是否理解您的问题,但也许您只需要将带有 facebook 徽标的 div 包裹在另一个 div 中,并添加一个display:flex;

Check this example and let me know if it answer your question :)检查这个例子,让我知道它是否能回答你的问题:)

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM