2016-04-07 8 views
0

こんにちはStackOverflowのユーザー、ブートストラップのdivが別のdivに折りたたまれていますか?

私はウェブサイトを作成していると私は私がビットで説明しますポイントに来るまで開始がかなりよく行っていた、私はすでに「時間とGoogleのために私のコードの上にしようと探していますすべての種類のものを私の問題に似た何かを見つけることができませんでした。 Here's an image of how the webpages currently look, the first obviously medium/large, the middle size small and the last one is extra small

画像から何かが間違っているとわかるように、私はdivが正しく閉鎖されていないと予想しましたが、私のコードでそのようなものを見つけることはできません!ここに私のコードは次のとおりです。

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <base href="/duo-uniek/" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
     <title>Home: Welkom - Duo-Uniek.nl</title> 
     <script src="javascript/jQuery.min.js"></script> 
     <script src="javascript/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
     <script type="text/javascript" src="Javascript/banner.js"></script> 
     <link rel="stylesheet" href="css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
     <link id="stylesheet" href="css/stylesheet.css" rel="stylesheet" type="text/css" /> 
    </head> 
    <body> 
     <div class="fluid-container"> 
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding-horizontal border-bottom header"> 
       <div class="list-group list-inline list-unstyled text-center"> 
        <span class="list-group-item col-xs-3 col-sm-2 col-md-1 col-sm-push-2 col-md-push-4 active">Home</span> 
        <a class="list-group-item col-xs-3 col-sm-2 col-md-1 col-sm-push-2 col-md-push-4" href="page/media.html">Media</a> 
        <a class="list-group-item col-xs-3 col-sm-2 col-md-1 col-sm-push-2 col-md-push-4" href="page/info.html">Info</a> 
        <a class="list-group-item col-xs-3 col-sm-2 col-md-1 col-sm-push-2 col-md-push-4" href="page/contact.html">Contact</a> 
       </div> 
      </div> 
      <div class="row-fluid col-xs-12 col-sm-12 col-md-12 col-lg-12 no-padding"> 
       <div class="banner hidden-xs hidden-sm col-md-12 border-bottom no-padding styling" style="height: 500px;"> 
        <div class="innerBanner col-md-12"> 

        </div> 
       </div> 
       <div class="banner visible-sm-block col-sm-12 border-bottom no-padding styling" style="height: 350px;"> 
        <div class="innerBanner col-sm-12"> 

        </div> 
       </div> 
       <div class="banner visible-xs-block col-xs-12 border-bottom no-padding styling" style="height: 200px;"> 
        <div class="innerBanner col-xs-12"> 

        </div> 
       </div> 
      </div> 
      <div class="col-sx-12 col-sm-12 col-md-12 col-lg-12 text-center padding-horizontal border-bottom styling"> 
       <div class="col-sx-12 col-sm-4 col-md-2 col-md-push-3 padding-horizontal" style="background-color: black;"> 
        <div class="col-sx-12 col-sm-12 col-md-12" style="background-color: white;"> 
         <p>Test</p> 
        </div> 
       </div> 
       <div class="col-sx-12 col-sm-4 col-md-2 col-md-push-3 padding-horizontal" style="background-color: black;"> 
        <div class="col-sx-12 col-sm-12 col-md-12" style="background-color: white;"> 
         <p>Test</p> 
        </div> 
       </div> 
       <div class="col-sx-12 col-sm-4 col-md-2 col-md-push-3 padding-horizontal" style="background-color: black;"> 
        <div class="col-sx-12 col-sm-12 col-md-12" style="background-color: white;"> 
         <p>Test</p> 
        </div> 
       </div> 
      </div> 
      <div style="background-color: orange;"> 
       <p>Home</p> 
      </div> 
     </div> 
    </body> 
</html> 

このコードは、私のコードとして「ショーのページのソース」からである、主にPHPによって生成されたが、私は本当に愚かだ場合を除き、私はすべてをチェックし、何が間違っていたされていないが。私は本当に何をすべきかわからない、私が試したものは助けにならなかったし、本当にこれを修正しなければならない...私は誰かがここにできることを願っている!

敬具、 ジェシー

+0

すべきですか?また、あなたのコードをチェックするには[Bootlint](http://www.bootlint.com/#byDirect)のようなものを使うべきです。 – litel

+0

前に言及してくれないことを申し訳ありませんが、私はこの質問を読む人のためにBootstrap 3.3.6を使用しています。それは既にグルワナベによって解決されましたが、あなたの反応にも感謝しています! – Jesse

答えて

0

あなたがタイプミスcol-sx-12を持っている、それはあなたが使用しているブートストラップのバージョンは何col-xs-12

+0

ああ私の神!あなたは正しいと私の問題を解決!私は非常に恥ずかしいので、これは私に数時間かかったし、助けhahaのStackoverflowを依頼する ありがとうございました! – Jesse

関連する問題