2016-12-26 7 views
0

だから、ついにBootstrap Buttonsを追加して何らかの理由で私の最初のコンテナスペースをたくさん作り出しました。誰もその間隔を修正する方法を知っていますか?ここでWebボタンの間隔を私のサイト

はコードです:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <title>{{ site.title }}</title> 
    <meta name="description" content="{{ site.description }}"> 
    <link rel="canonical" href="{{ site.url }}/"> 
    <link rel="alternate" type="application/atom+xml" href="/feed.xml"> 
    <style type="text/css"> 
     {% capture css %}{% include fonts.css %}{% include index.css %}{% endcapture %}{{ css | scssify }} 
    </style> 
</head> 
<body> 
    <div id="intro"> 
     <div class="container"> 
    <div class="btn-group"> 
    <button type="button" class="btn btn-primary">Home</button> 
    <button type="button" class="btn btn-primary">About</button> 
    <button type="button" class="btn btn-primary">Announcements</button> 
    <button type="button" class="btn btn-primary">Staff List</button> 
    <button type="button" class="btn btn-primary">Forum</button> 
    <div class="btn-group"> 
     <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> 
     Twitters <span class="caret"></span></button> 
     <ul class="dropdown-menu" role="menu"> 
     <li><a href="https://www.twitter.com/fazemelonking">FaZeMelon</a></li> 
     <li><a href="#">MrPramire</a></li> 
     <li><a href="https://www.twitter.com/AvalancheYT">AvalancheYT</a></li> 
     <li><a href="https://www.twitter.com/falcesoyt">falceso</a></li> 
     <li><a href="https://www.twitter.com/PacksGamingHD">PacksGamingHD</a></li> 
     </ul> 
    </div> 
    </div> 
</div> 
     <div id="introcontainer"> 
      <i></i> 
      <p>Pramire</p> 
      <h1>FreedomOP Minecraft Server</h1> 
      </div> 
    </div> 
    <div id="about"> 
     <div id="aboutcontainer"> 
      <h2>About</h2> 
      <p> 
       Pramire provides an experience you will not find anywhere else. Pramire has excellent staff, and a great community. The support team is responsive, and having fun is what we're all about. Pramire really does make it fun to play with pixels. 
      </p> 
      <div id="ip"> 
       <span>IP</span> 
       <i>Coming Soon</i> 
      </div> 
     </div> 
    </div> 
    <div id="news"> 
     <div id="newscontainer"> 
      <h2>News</h2> 
      <ul> 
       {% for post in site.posts %} 
        <li> 
         {{ post.content }} 
         <span>{{ post.date | date: "%B %e, %Y" }}</span> 
        </li> 
       {% endfor %} 
      </ul> 
     </div> 
    </div> 
    <div id="feedback"> 
     <div id="feedbackcontainer"> 
      <h2>Feedback</h2> 
      <p> 
       Do you have anything you would like to say about the server? Suggestions for new features? Send us your feedback below. 
      </p> 
    <p>The feedback action is currently disabled.</p> 
      </form> 
     </div> 
    </div> 
    </div> 
</body> 
</html>{% endcapture %}{{ content | strip_newlines | replace:' ','' }} 
Contact GitHub API Training Shop Blog About 

答えて

1

あなたのCSSファイルに移動して、ラインに

#intro{ 
    height:auto !important!; 
} 

を追加する場合は、動的コンテンツへのコンテナのサイズを設定することにより、あなたが望むものを達成する必要があります。

特定の高さが必要な場合は、をピクセル単位で必要な高さに置き換えます。

関連する問題