0

ポートフォリオサイトを作るために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 つの画像で発生しますが、これはまったく奇妙です。

ありがとう!

4

0 に答える 0