Question

enter image description here my panel banner

hi..i已经制作了这个面板，但标记为红色的是空格...我无法从此页面中删除此空间。

或者它适用于我可以设置横幅。

下面的代码仅供参考......

 </head>
  <body>
    <div class="container">
    <div><h2 style="background-color:#00CCCC" align="center" "height:50px" width="550px" >SMS Panel</h2></div>
      <div class="col-sm-2">
          <ul class="nav nav-pills nav-stacked" style="background-color:#FFCCFF">
            <li class="active"><a href="#">Subscriber info and message</a></li>
            <li class="dropdown">
              <a href="#">Home</a>
              </li>
            <li><a href="#">Show subscriber</a></li>
            <li><a href="#">unknown menu</a></li>
          </ul>

Answer 1

如果不查看完整的代码，很难说出确切的问题。我会抓住它。它可能正在发生，因为您没有为面板执行CSS重置。默认情况下，许多HTML元素具有非零边距。您可以阅读有关CSS重置here的更多信息。

要解决此问题，您可以为面板下方的元素提供适当的负边距。它在IE7和旧版浏览器中会出现问题，但可以在所有现代浏览器中使用。要找到问题的实际根本原因，您需要检查Chrome检查器或Firebug中的面板元素，并且需要检查面板或其下方元素是否有任何边距或填充。

更新：根据给定的小提琴，您需要添加以下规则

h2, ul {
    margin: 0; 
}

Updated fiddle link

Answer 2

你的h2标签底部有一个约5或10px的边距，如果你将底部的边距设置为0，它将删除空格。

Answer 3

您没有使用<div class ="row">整理您的布局。某些样式仅在您使用行div

时应用

Answer 4

试试这个，

替换此行代码

<div class="col-sm-2">

到

<div class="col-sm-2" style="margin: -20px 0px 0px ! important;">

即根据您的代码http://jsfiddle.net/g2khLdtb/1/，您已发布上述评论

我将如何设置横幅或如何从我的页面中删除此空间

4 个答案: