2012-03-12 5 views
0

화면 해상도에 따라 자체 조정되지 않는 웹 페이지를 디자인 중입니다. 더 높은 해상도에서는 괜찮아 보이지만 1024x768에서는 페이지의 왼쪽 만 보입니다. 나는 모든 것을 컨테이너에 넣고 그것을 센터에 정렬 시키려고했지만 작동하지 않습니다. 나가는 길은 무엇입니까?화면 해상도에 따라 웹 페이지 수정

다음은 HTML의 조금의 :

<div id="layer-container" style="position:absolute; background- image:url(images/bkgrd_final.jpg);">   
    <div id="info-layer" style="position: absolute; text-align: left; left: 0px; top: 2px; height: 747px; z-index: 48; display: block; margin:0 0 0 -285px;" title="">      

그리고 여기에 몇 가지 CSS입니다 : 당신이 작은 장치의 스타일로 mediaqueries를 추가 있습니다 sugest 것

div#container { 
    position:absolute; 
    margin:0 auto; 
    text-align:left; 
    overflow:visible; 
} 
body { 
    font-size: 8px; 
    line-height: 1.1875; 
    text-align: center; 
    margin: 0; 
    background-color: #0C0C0C; 
    background-repeat: repeat-x; 
    background-position: center top; 
    color: #000000; 
    overflow-x:hidden; 
} 
+0

정확히 무엇을 보여 주려하고 HTML이 어떻게 작동하는지에 따라 답변이 "의존적"이기 때문에 사람들이 귀하의 페이지에 대한 HTML을 보지 않고도 당신을 도울 수 있습니다. – jfriend00

답변

2

.

모바일 장치 용 페이지를 디자인하여 "모바일 우선"으로 이동하십시오. 더 큰 장치를위한 여분의 스타일을 가진 미디어 쿼리를 추가하십시오.

관련 문제