0
divの内部コンテンツに関係なく、同じ行の異なるdiv間でイメージを水平に整列させる方法を理解できますか? 私は絶対的なポジショニングを試みましたが、このインタビューテストではすべてを内部divコンテナ内に保持する必要があります。異なるdiv間でイメージを水平に整列する方法
例: - "コンテナ流体"
<div class="row">
<div class="col-md-3 product-box">
<div class="col-md-12 background-contain">
<p class="blue-title">Product Title 1</p>
Staring at $500
<br> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<br>
<div class="img-contain">
<img src="materials/images/cereal_b.jpg" class="img-responsive" alt="cereal" />
</div>
<a class="bottom-link">Learn More</a>
</div>
</div>
<div class="col-md-3 product-box">
<div class="col-md-12 background-contain">
<p class="blue-title">Product Title 2</p>
Staring at 1900
<br> Donec ornare magna sit amet erat molestie sollicitudin ac vitae lectus.</br>
<img src="materials/images/flower_b.jpg" class="img-responsive" alt="cereal" />
<a class="bottom-link">Learn More</a>
</div>
</div>
<div class="col-md-3 product-box">
<div class="col-md-12 background-contain">
<p class="blue-title">Product Title 3</p>
Staring at 1900
<br> Cras non metus sed odio tristique imperdiet.</br>
<img src="materials/images/machine_b.jpg" class="img-responsive" alt="cereal" />
<a class="bottom-link">Learn More</a>
</div>
</div>
<div class="col-md-3 product-box">
<div class="col-md-12 background-contain">
<p class="blue-title">Product Title 4</p>
Staring at 1900
<br> Pellentesque mattis tellus ut molestie dapibus.</br>
<img src="materials/images/candy_b.jpg" class="img-responsive" alt="cereal" />
<a class="bottom-link">Learn More</a>
</div>
</div>
</div>
</div>
あなたのCSSを含めるとかなりのスクリーンショットへのリンクよりスニペットを作成してください。 – Shaggy
'.col-md-12.background-contains img {position:absolute;}を試したことがありますか?下:x em;左:50%;トランスフォーム:translateX(-50%); } '? – Jibeee
見た目は私に揃っていますhttps://jsfiddle.net/kvb5hb6f/15/ –