どのように私は、ブートストラップ3

Question

良い一日では、これらの画像間の空白を削除する起業家のための無料のワードプレスのテーマを構築する過程で

アムが、これは、挑戦に遭遇します：

を

1. 上記の画像に示すように、ポストコンテナの間に空白を取り除きたいです。

2. 間の投稿では、投稿の日付が表示されません。理由はわかりません。ここ

私のコードです：

HTML/PHP

<div class="container-fluid"> 

<div class="navbar"> 

<div> 
<a class="navbar-brand" href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>" > 
<?php bloginfo('name'); ?></a> 
</div> 

<div> 
    <!--<h1 class="blog-title"><?php bloginfo('name'); ?></h1>--> 
    <?php $description = get_bloginfo('description', 'display'); ?> 
<?php if($description) { ?><p class="blog-description"><?php echo $description ?></p><?php } ?></p> 

    <?php wp_nav_menu (array( 
     'theme_location' => 'header-menu', 
     'menu_class' => 'nav navbar-nav pull-right' 
    )); ?> 

</div> 

CSS：

.layerit { 
width: 100%; 
height: 100%; 
padding-top: 170px; 
margin: 0 auto; 
background: rgba(0, 0, 0, .3); 
position: relative; 
bottom: 0; 
right: 0; 
text-align: center; 
transition: background-color .9s ease; 

} 

.home-title { 
color: white; 

} 

.home-author { 
color: white; 
padding-top: 20px; 
padding-bottom: 90px; 
} 


div.no-margin { 

} 

は助けてくれてありがとう。

Answer 1

縦線の場合： font-size：0; 垂直整列：親要素に

OR

ul { 
 
    padding: 0; 
 
} 
 
li{ 
 
    display: inline-block; 
 
    background: red; 
 
    width: 20px; 
 
    height: 20px; 
 
}

<ul> 
 
    <li></li> 
 
    <li></li> 
 
</ul>

は、水平線について

ul { 
 
    padding: 0; 
 
} 
 
li{ 
 
    display: inline-block; 
 
    background: red; 
 
    width: 20px; 
 
    height: 20px; 
 
}

<ul> 
 
    <li></li><li></li> 
 
</ul>

BEべきでトップ。子要素のため

EDIT：単一行ですべての<li>のタグを置くには、元の質問にスペースを引き起こしているものである、マークアップに空白文字を削除します。それを修正するもう1つの方法は、終了タグと次の開始タグの間にhtmlコメントを使用することです：

<li>...</li><!-- 

--><li>...</li><!-- 

--><li>...</li>