2012-04-09 63 views
0

我是HTML和CSS的新手,一直在努力解决一个简单的问题。我正在设计一个音乐空间:http://theparadisegarage.co/,我试图定位主文本框,以便文本在相同位置的箱子后面“消失”(即结束)。实际上,文本框根据窗口大小更改位置。我试图将位置设置为绝对值,并在底部给它一个固定的(px)保证金,但似乎不起作用。为了让你了解我想要的文本框的基本位置,我将文本框定位在浏览器窗口的顶部(因为这似乎是出于某种原因)。我已经包含了relavent CSS。我很难过......先谢谢你的帮助!内容定位相对于背景

<html> 
     <body style="background-color:transparent"> 
     <div id="container" style="background-color:transparent" > 
      <div id="logo"> 

      </div> 
      <div id="content" style="float:left" > 

      </div> 
      <div id="navbar" style="position:fixed"> 

     </div> 
     </div> 

    </body> 
    </html> 


    body{ 
     width: 100%;  
     height: 100%;  
     margin: 0;  
     padding: 0; 
    background-image:url(paradisebackground6.jpg); 
    background-repeat:no-repeat; 
    background-attachment: fixed; 

    } 


    container { 
position:relative; 
width:100%; 
height:100%; 
    } 

    content{  
     position:relative; 
    vertical-align:bottom; 
    margin-top:12.5%; 
    margin-left:190px; 
    margin-right:auto; 
    width:625px; 
    height:372px; 
    overflow:auto; 
    z-index:-40 
} 

回答

0

看起来像你想出来的?使用z-index将元素放置在其他元素的前面或后面。

+0

不幸的是,我试图创造一个前景(箱子)和背景(记录袖子),但是当我把前景放在文本上方时,它不会让我再滚动。 – LukeTodd 2012-04-09 17:32:31

0

,当你在CSS的使用位置,这是更好地在使用上/下/左/右页边距,而不是:

#content{ 

    position:relative; 
    top:12.5%; 
    left:190px; 

    width:625px; 
    height:372px; 

} 

注意:您必须CSS选择器前使用#!

+0

不知道...谢谢你的提示! – LukeTodd 2012-04-09 17:40:28