Question

我需要在容器底部内嵌一些图像。我试着按this问题做了，但我不明白为什么和我一起工作并逃离容器。你可以帮帮我吗？这是我的代码：

<div id="banner">
<div id="uscite">
    <div id="jp"><img src="../img/uscite/scan.png" height="90" width="60" alt="" /><br />text</div>
    <div id="it"><img src="../img/uscite/scan.png" height="90" width="60" alt="" /><br />text</div>
</div>
<div id="nav_main">
    <div style="margin: 0 auto;"><img src="../inc/home.png" /></div>
    <div style="margin: 0 auto;"><img src="../inc/staff.png" /></div>
    <div style="margin: 0 auto;"><img src="../inc/forum.png" /></div>
    <div style="margin: 0 auto;"><img src="../inc/disclaimer.png" /></div>
    <div style="margin: 0 auto;"><img src="../inc/secret.png" /></div>    
</div>
</div>

CSS ：

div#banner{
    padding:10px;
    border:1px solid #444444;
    background: url('header2.png') no-repeat center center;
    height:400px;
}

div#nav_main{
    position: absolute;
    left: 0;
    width: 1180px; 
    bottom: 0;
}
div#uscite{
    padding:30px 20px;
    float:right;
    border:0px;
    height:35%;
    width:20%;
}

div#jp{
    text-align: center;
    width:50%;
    height:100%;
    float:left;
    border:0px;
}
div#it{
    text-align: center;
    width:50%;
    height:100%;
    float:right;
    border:0px;
}

http://jsfiddle.net/nu7eoj0q/1/

编辑：我还想在＆＃34; uscite＆＃34;下添加另一个div（称为＆＃34; social＆＃34;）。但它并没有出现。我错了什么？ http://jsfiddle.net/faeba3v1/

Answer 1

我想你想这样做

Js Fiddle

添加了新属性

#nav_main div{
    display:inline-block;
}

div#banner{
   position:relative;
}

将div定位在底部内联

1 个答案: