Search code examples
javascriptjqueryhtmlcssinline

DIV tags display: inlineblock;

I am going to create 3 div tags the first two are adjacent to one another. The 3. Div tag is under the first two DIV tags.I have already done this, but I have inserted into the first div a slideshow, but then they are all become "display: block;".

Fiddle

I already try to change the code...

Solution

  • Try this will help:

    .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%;
}

    FIDDLE