html - 如何最小化我的品牌组件之间的空间

Question

我有一个顶级导航栏，但目前登录用户名、日期和时间以及搜索之间有很多空格，如下所示：-

但是有没有办法最小化组件之间的空间，如下所示： -

我当前用于顶部导航的 html 是：-

<section id="login" class="navbar-search pull-right">
<span class="username" style=" display:block;"><i class="icon-user"></i><strong> @User.Identity.Name.Substring(User.Identity.Name.IndexOf("\\") + 1)</strong></span>
<div style="text-align:right">
<p id="currentdate"></p>
<p id="currenttime" ></p>   
    </div>
<form class="customSearch" method="GET" action="@Url.Action("Search", "Home")">
<input  class="searchInput" placeholder="Search" name="searchTerm2" data-autocomplete-source= "@Url.Action("AutoComplete", "Home")" type="text"  />
</form>
                    </section>

Answer 1

我建议您使用 Chrome 浏览器检查元素并查看 CSS 中哪里出了问题，简单方便，我一直这样做。

Answer 2

在 css 中使用 line-height、margin 或 padding 属性。