jquery - フローティング Basic jQuery スライダー

Question

私のウェブサイトでBasic jQuery スライダー ( http://www.basic-slider.com ) を使用しています: http://www.bizgamesstudios.com/

私の目標は、スライダーを左に浮かせて、下の箇条書きがスライダーと並んで立つようにすることです。ただし、float: left を適用すると、スライダーが折りたたまれます。

スライダーの外観を変更せずにこれを行う方法についてのアイデアはありますか?

ありがとう

Answer 1

スライドショーには最大幅が設定されていましたが、実際の幅が設定されていませんでした。左にフロートすると、#content はスライドショーの高さを考慮しませんでした。

#content の高さ、#slideshow の幅、および #width を機能リストに追加すると、機能するはずです。

この CSS を試してください:

#slideshow {
    width: 600px;
    float: left;
    }

.featureList {
    width: 300px;
    float: left;
    }

#content {
    margin: 0 auto;
    padding: 25px 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25);
    background: #fff;
    height: 600px;
    }

Answer 2

あなたのサイトは幅が固定されているので、に幅を追加して右にフロートさせることができます:

.featureList {
    width: 530px;
    float: right;
}

また、#slideshow の最大幅を幅に変更します。

#slideshow {
  width: 600px;
}

最後に、clearfix クラスを #game1 div に追加します。

Answer 3

これらのプロパティを .featureList に適用します。

float: right;
margin-top: -300px;
margin-right: -80px;