Question

尝试让多行div显示在外部div中...首先＆＃34; row＆＃34;工作正常，第二次覆盖...

我制作了2张图片，一张，test.png是一张绿色背景图片，400张（宽）x 840张（高）...第二张是红色背景，360张（宽度）x 756张（h）...它没有＆＃39; t似乎我可以上传它们？我用红色做了第二次，所以我可以判断它是否覆盖......它覆盖了第一列...... 我无法找到相关的文字/说明告诉我如何做到这一点... divs left_promo和right_promo是＆＃34;行＆＃34; ...当我调用left_promo为第2＆＃34时; row＆＃34;，它覆盖第一行，左列，并且不会在新的＆＃34;行＆＃34;边界... 如果你需要这些图片，我可以把它们包括在内，如果有人告诉我怎么样......似乎我不能......

  1) HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <link rel="stylesheet" type="text/css" href="C:\GNO\css\newmain.css" />
<p>some text</p>
<div style="padding: 0 8px; height: 1100px; width: 1150px; overflow: auto;"> 
<div class="left_promo">
 <img src="C:\GNO\images\test.png">
</div>

 <div class="right_promo">

 <img src="C:\GNO\images\test.png">

  </div>

 <div class="left_promo">
 <img src="C:\GNO\images\red.png">
</div>  

  </div>
<!-- <div style="padding: 0 8px; height: 800px; width: 1150px; overflow: auto;"> 
 -->
<!--    </div>
 -->
</html>

  2) CSS code  
    @charset "utf-8";
/* CSS Document */
/* padding is top, right, bottom, left  */ 

div.left {
    background:#F7E2F1;
    height:1650px;
    width:200px;
    position:absolute;
    margin:10px 10px 10px 10px;
}
div.left_promo {
    height:450px;
    width:565px;
   position:absolute;
     margin:10px 10px 10px 10px;
}
div.right_promo {
    height:450px;
    width:565px;
   position:absolute; 
    margin:10px 10px 10px 620px;
}

div.right{
    background:#F7E2F1;
    height:1650px;
    width:650px;
    position:absolute;
    right:0px;
    margin:10px 440px 10px 10px;   /* the right offset margin pushes the content left   */
}

.container{
    background:#F7E2F1;
    height:1650px;  
    width:1550px;
    position:relative;
    margin:10px 10px 10px 10px;
}
.bottom{
    background:purple;
    height:150px;
    width:980px;
    margin:140px 10px 10px 10px;
}

Answer 1

我不太了解这个问题。但坚信这就是你想要的。

这是小提琴http://jsfiddle.net/tyy6p621/。您只需要正确关闭并打开一些标签

    <div style="padding: 0 8px; height: 1100px; width: 1150px; overflow: auto;"> 
       <div class="left_promo">
              <img src="http://3.bp.blogspot.com/-5WVRHaM3hGo/UrT2eNS11GI/AAAAAAAAUZo/W3YcLkt10z0/s1600/s4-mini-la-fleur-.jpg">
        </div>

        <div class="right_promo">
             <img src="https://m1.behance.net/rendition/modules/54304027/disp/b01a81ad9fac3f60ab871f18d8db2db9.jpg">
        </div>
    </div>
    <div style="padding: 0 8px; height: 1100px; width: 1150px; overflow: auto;"> 
        <div class="left_promo">
            <img src="http://3.bp.blogspot.com/-5WVRHaM3hGo/UrT2eNS11GI/AAAAAAAAUZo/W3YcLkt10z0/s1600/s4-mini-la-fleur-.jpg">
        </div>

        <div class="right_promo">
            <img src="https://m1.behance.net/rendition/modules/54304027/disp/b01a81ad9fac3f60ab871f18d8db2db9.jpg">
        </div>

    </div>

div行覆盖....例如：外部div是整个页面......在其中，有“n”行div，每行有2列......

1 个答案: