画像の横に div が浮かんでいます。これは投稿のリストです。右側の div には、その特定の投稿に関する情報が箇条書きリストで保持されます。div は完全に流動的ではありませんが、特定のブレークポイントで幅が変わります。常に同じサイズの画像の高さを最小にしたいdiv。div の上部と下部に表示したいコンテンツ、フィリグレの間の上部と下部に div 内の画像があります。
ボックスに画像の長さと位置を拡張させることができます:下の画像を基準にして流動的にするか、画像を位置にすることができます:位置であるdiv内で絶対:相対。しかし、それは流動性を殺します。
両方できますか？
これが私のフィドルです： http://jsfiddle.net/4Kyye/1/
そしてCSS：
* {
box-sizing: border-box;
}
.specials-module-inside {
margin: 30px auto 30px auto;
width: 720px;
overflow: auto;
}
.absolute {
position:absolute;
bottom: 5px;
}
h3 {
text-align: center;
margin-bottom: 20px;
color: #231f20;
font-family: steelfish, helvetica, arial, sans-serif;
font-size: 30px;
letter-spacing: 3px;
text-shadow: 1px 1px 0 #ffffff, -1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px -1px 0 #ffffff, -2px 2px 0px #d9c09e;
}
.info-box-small {
float: right;
margin: 0;
padding: 5px;
width: 286px;
color: #231f20;
border: 1px solid #5a5655;
min-height: 220px;
position: relative
}
.full-width-image {
width: 100%;
}