2016-10-14 8 views
3

を働いていないブートストラップ画面サイズ?ここでは隠され-XSは私がちょうど隠され-SMをなど、隠れた-XSを知ったので、これはどんなのレビューdiv要素を隠していません。..</p> <p>どのように来る最初の時間のためにそれをしようとしています

<div class="row hidden-sm"> 
    <div class="col-xs-12"> 
     <result-reviews [result]='selectedResult?.result.result'></result-reviews> 
    </div> 
</div> 

は、私のコードの詳細です:

<div class="modal-body"> 
    <div class="container-fluid"> 
     <div class="row"> 
     <div class="col-lg-7"> 
      <div class="row"> 
       <div id="image-div" class="col-sm-5 col-lg-5"> 
        <result-image [result]='selectedResult?.result.result'></result-image> 
       </div> 
       <div class="col-sm-7 col-lg-7"> 
        <result-attributes [result]='selectedResult?.result.result'></result-attributes> 
       </div> 
      </div> 
      <div class="row hidden-sm"> 
       <div class="col-xs-12"> 
        <result-reviews [result]='selectedResult?.result.result'></result-reviews> 
       </div> 
      </div> 
     </div> 
     <div class="col-lg-5"> 
      <div id="shops-section"> 
       <div id="map" #map></div> 
       <ul> 
        <li *ngFor="let shop of selectedResult?.result.result.nearbyShops"> 
        <div class="shop-details"> 
         {{ shop.name }} 
        </div> 
        </li> 
       </ul> 
      </div> 
     </div> 
     </div> 
    </div> 
</div> 

答えて

3

どのバージョンのブートストラップを使用していますか?ブートストラップ4アルファに隠され-XSクラス(およびSM、MD、...)、ここで説明したように隠された-XSアップや隠された-XSダウンに置き換えられています http://v4-alpha.getbootstrap.com/layout/responsive-utilities/

+0

それはそれでした!私はブートストラップを使用しています。4.ありがとう! – BeniaminoBaggins

1

これは、任意の画面サイズのレビューのdiv要素を隠していませんどのように来ますか?

ブートストラップドキュメントのこの部分を読む:http://getbootstrap.com/css/#responsive-utilities-classes

hidden-smは768と992px幅のサイズに適用されます。

+0

しかし、どの画面サイズでも隠されることはありません。私はhidden-xs hidden-mdなども追加し、ブラウザウィンドウのサイズを変更してすべての画面サイズをテストし、どれも隠されていません。 – BeniaminoBaggins

+0

さて、ここで意図したとおりに動作します:http://codepen.io/anon/pen/ALgJdmこれは*あなたのコードで、 'hidden-sm'にクラス' x'を追加した唯一の変更ですdivをもっと明白にする(ed矩形として表示する)。ウィンドウのサイズを変更すると、幅が768〜992ピクセルの間は赤い四角形が消えます。 – Johannes

+0

うん。私のブートストラップで何かが間違っているはずです。しかし、それはすべての4つのウェブサイトのページのためにそれを使用してきたので、それはすべてが正しく動作するので、それは奇妙です。私はbower_components経由でブートストラップをインストールしています。代わりにCDNを使用しようとしていて、ブートストラップが正しく取得されていません。 – BeniaminoBaggins

0

それはd-none d-sm-block!トライで動作しますあなたが部門を隠したい場合はこれ。

参考のため、これはリンクですGetbootstrap Migration

関連する問題