ポートフォリオサイトを作るためにTwitter BootstrapとWordpressを使っています。Bootstrap コア CSS (bootstrap.css と Respond.css) は変更していませんが、カスタム CSS をいくつか調整して追加しました。
この場合、これをカスタム CSS として使用して、6 つのサムを持つ 2 列のギャラリーを作成しました。
#featured-content {
padding: 3.125%;
}
#featured-content article.span4 {
float: left;
width: 48.33333333333333%;
margin: 0;
padding: 0;
margin-bottom: 20px;
}
#featured-content article.span4.even {
margin-left: 3.33333333333334%;
}
#featured-content article.span4 img {
min-width: 100%;
}
これは、ポートレート モードでの魅力のように機能します。
ただし、横向きモードでは、最後の 2 つの画像でこの醜いバグが発生しています。
画像は同じサイズなので問題ありません。また、すべての CSS はパーセンテージに基づいているため、ユーザーが横向きに切り替えると、縦横比を維持しながらスケーリングする必要がありますよね?
また、これは最後の 2 つの画像で発生しますが、これはまったく奇妙です。
ありがとう!