为什么我不能移动这个div及其内容？

我正在做一个练习，因为我最近开始编程，并且在我的道路上遇到了区域阻塞，我不是在开玩笑，当我说自从上午以来，我一直被困在这部分中，首先是一些麻烦的图像，现在这个。为什么我不能移动这个div及其内容？

基本上我需要移动一个有imgs和一些文本的div，所以它只停留在“Logo”下方，但它不会改变！我尝试了很多这个，但唉，没有用，我甚至在firebug上检查过它，看起来好像包含标识的div超出了它应该的范围，但我很积极，我没有把它搞乱。

此外，我不能使用
，html或％的样式。

<div id="header"> 
    <img src="imgs/logo.png" id="logo" /> 
    <img id="donate" /> 
     <div id="divMenu"> 
      <ul id="menu"> 
       <li><a href="#">Home</a></li> 
       <li><a href="#"> About </a></li> 
       <li><a href="#"> Our Programs </a></li> 
       <li><a href="#"> Gallery </a></li> 
       <li><a href="#"> Contact </a></li> 
       <li><a href="#"> Blog </a></li> 
      </ul> 
     </div> 
</div> 

<div id="bodyLogo"> 
    <img src="imgs/bg-featured.jpg"alt="" /> 
</div> 
<div id="slogan"> 
    <p>As The Saying Goes.. </p> 
    <p>You Don’t Know What You’ve Got </p> 
    <p> ‘Till It’s Gone.</p> 
    <h2>Plant A Tree.</h2> 
    <h2> Grow A Tree.</h2> 
    <h2><span id="tituloSpan">Save The Future.</span></h2> 
</div>

这里是它使一个无形的跳跃，我不能桥梁！

<div id="divPictures" class="opacity"> 

    <div class="left"> 
     <a href="#"><img src="imgs/help-out.jpg" alt=""></a> 
     <p>"TEXT"</p> 
     <div id="flecha"> 
      <img src=""> 
     </div> 
    </div> 

    <div class="right" > 
     <a href="#"><img src="imgs/what-we-do.jpg" alt=""></a> 
     <p>"TEXT."</p> 
     <div id="flecha"> 
      <img src=""> 
     </div> 
    </div> 
</div>

而CSS：

body{ 
    width: 956px; 
    font-family: 'Rokkitt', serif; 
    background: url("../imgs/bg-header.jpg"); 
    background-repeat:repeat-x; 
    text-decoration: none; 
    margin: 0 auto; 
    } 


    #bodyLogo{ 
height: 396px; 
position: relative; 
margin: 18px 0 0 0; 
} 


#divPictures{ 
position: absolute; 
width: 956px; 
background: url("../imgs/bg-body.jpg"); 
margin: 0 0 700px 0 ; 
vertical-align: top; 
} 

.left{ 
width: 478px; 
float:left; 
font-family: 'Quattrocento Sans', sans-serif; 
} 

.right{ 
width: 478px; 
float:right; 
font-family: 'Quattrocento Sans', sans-serif; 
} 

.left img, .right img{ 
margin: 0 0 0 10px; 
} 

    #flecha{ 
background: url("../imgs/arrow-gray.png"); 
background-repeat: repeat-x; 
width: 460px; 
}

在此先感谢了很多。最好的祝愿。

来源

2014-03-06 Code Grasshopper

你在你的#bodyLogo上有固定的高度，这会使它延伸超过它的尺寸。我不知道你的图像有多大，但是如果你移除了这个高度，所有的东西都应该在它的正下方。

来源

2014-03-06 03:05:12 quesoflorecido

谢谢！我结束了使用position：absolute并删除高度。 –

为什么我不能移动这个div及其内容？

回答

相关问题