UIKit フレームワークを使用してサイト全体を構築しています。レスポンシブ グリッドを機能させるのに苦労しています。私のコードが添付されています。
中程度のブレークポイントよりも小さいすべての画面で、グリッドを互いに重ねて配置したいと考えています。ブラウザウィンドウのサイズを変更するとうまく機能しますが、クロムを使用してレスポンシブテストでテストするとまったく機能しません。また、ページをサーバーにアップロードせずにローカルでテストすると、レスポンシブ グリッドは問題なく動作しますが、レスポンシブの高さと幅のクラスは機能しません。
前もって感謝します
<section id="past">
<h1 class="uk-responsive-width uk-responsive-height">What Have I Done?</h1>
<div class="uk-grid" data-uk-grid-margin>
<div id="ccb" class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-3">
<a href="#ccb_des" data-uk-modal="{center:true}">
<img id="ccb_thumbnail" src="img/ccb_thumbnail_resize.jpg" alt="Cranbrook Culture Book" class="uk-border-rounded">
</a>
</div>
<div id="cfc" class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-3">
<a href="#cfc_des" data-uk-modal="{center:true}">
<img id="cfc_thumbnail" src="img/cfc_thumbnail_resize.jpg" alt="Cranes for Change" class="uk-border-rounded">
</a>
</div>
<div id="trombetta" class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-3">
<a href="#trombetta_des" data-uk-modal="{center:true}">
<img width="300" height="200" id="trombetta_thumbnail" src="img/trombetta_thumbnail.jpg" alt="Trombetta Intern" class="uk-border-rounded">
</a>
</div>
</div>
</section>