2012-03-04 3 views
0

내 배경을 position: absolute;의 위에 몇 개의 div 요소로 작동 시키려면 어떻게해야합니까? 다른 화면 해상도에서 내 div 요소와 배경을 동기화되도록 유지하려고합니다. 아래는 지금까지 구현 한 작은 코드입니다.배경 이미지가 div로 유지됩니다.

<!doctype html><head> 

<title>Coming Soon! </title></head> 



<style> 

* { 

padding: 0px; 
margin: 0px; 
} 

#searchfold { 
    background: url("../imgs/search_box.png") no-repeat scroll 0 0 transparent; 
    height: 335px; 
    margin-left: 173px; 
    margin-top: 135px; 
    width: 890px; 
    position: absolute; 

} 


#bottomfoldbox { 
    background: url("../imgs/bottom_foldbox.png") no-repeat scroll 0 0 transparent; 
    height: 335px; 
    margin-left: 173px; 
    margin-top: 750px; 
    width: 890px; 
    position: absolute; 
} 

#searchfield { 
    float: right; 
    height: 50px; 
    margin-right: 178px; 
    margin-top: 250px; 
    width: 296px; 
} 


</style> 


</head> 

<body style="background-image: url('http://mysite.com/wp/wp-content/uploads/2012/02/mysite_Homepage.gif'); background-repeat: no-repeat; background-position: center; height: 1055px; position: relative;"> 


<div id="searchfold"> 

<div id="searchfield"> 
<form name="input" action="html_form_action.asp" method="get"> 
<input type="text" name="user" style="height:40px; width:200px;"/> 
<INPUT type="image" name="search" src="../imgs/search_btn.png" border="0" style=" float: right; 
    margin-right: -130px; 
    margin-top: -19px;}"></form> 
</div> 

</div> 



</div> 


<div id="bottomfoldbox"> 


</div> 
</div> 

</body> 


</html> 
+1

어디 개방''태그입니까? * (참고 :'DOCTYPE'는 계산되지 않습니다.) * –

+0

so, ?? –

+0

아직도 운이 없다, 응답을위한 감사! –

답변

0

나는 서로 다른 화면 해상도를 치료하는 미디어 쿼리를 사용하도록 권 해드립니다 제대로

관련 문제