javascript - DIV タグの表示: インラインブロック。

Question

最初の 2 つは互いに隣接する 3 つの div タグを作成します。3. Div タグは、最初の 2 つの DIV タグの下にあります。これは既に行っていますが、最初の div にスライドショーを挿入しましたが、すべて「display: block;」になっています。

フィドル

私はすでにコードを変更しようとしています...

Answer 1

float プロパティを使用してこれを実現できます。更新された JSFiddle を参照してください: http://fiddle.jshell.net/cZN8x/

2 つの隣接する div に float left と right を適用することで、合計幅がコンテナーよりも小さい限り、それらは互いに並んで収まりますが、この場合は問題ありません。フロートを使用することで得たのは、CSS プロパティで空の div を使用してリセットする必要があることです。

clear: both;

それが役立つことを願っています!

Answer 2

これを試してみてください：

.clear {
    clear: both;
}
.box {
    position: relative;
    background: rgba(255,255,255,.81);
    box-shadow: 0 0 10px #090909;
    border-radius: 3px;
}
.box:hover {
    transition: background .3s;
    background: rgba(255,255,255,.85);
}
#news {
    float: left;
    display: inline-block;
    height: 300px;
    width: 693px;
}
#login {
    display: inline-block;
    height: 300px;
    width: 275px;
    left: 10px;
}
#info {
    display: block;
    height: 120px;
    width: 978px;
    margin-top: 10px;
    margin-left: 7.68%;
}

フィドル