居中網頁

我想中心我的網頁。還有一個分1000px，並且它可以擴展。目前我的頁面在縮放時偏離中心30％ - 中心-70％。我很困惑，爲什麼會發生這種情況。如果任何人都可以解釋爲什麼發生這種事情會很好。居中網頁

enter image description here

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Title</title> 
<style type="text/css"> 


#page { 
    position:relative; 
    display:block; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:0; 
} 
#pageImg { 
    position:absolute; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:1; 
} 
#navBarImg { 
    position:absolute; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:2; 
} 

</style> 
</head> 
<body> 
<div id="page"> 
    <img id="pageImg" src="../Navigation/backgroundImg.png" /> 
    <div id="navBar"> 
     <img id="navBarImg" src="../Navigation/navBarBGImg.png" /> 
    </div> 
</div> 
</body> 
</html>

來源

2013-07-18 BDGapps

我不明白你問 –

保證金：0汽車; –

哪個ID？.... – BDGapps

也許嘗試50％，你的頁面寬度......我覺得你做的75％，75％得到了你的結果......

例子 - http://jsfiddle.net/rob_towner/q8vKK/

#page { 
position:relative; 
display:block; 
width:50%; 
margin:auto; 
min-width:1000px; 
z-index:0; 
}

來源

2013-07-18 01:18:41

沒有工作 – BDGapps

還有其他代碼需要考慮，您尚未發佈。這可以推斷出來，因爲你所發佈的代碼按照你的意圖工作。 A working example（1000px的寬度將不適合渲染窗口的默認窗口大小，請使用滑塊展開它並查看代碼是否正常）。

你的CSS我用：

#page { 
    position:relative; 
    display:block; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:0; 
} 
#pageImg { 
    position:absolute; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:1; 
} 
#navBarImg { 
    position:absolute; 
    width:75%; 
    margin:auto; 
    min-width:1000px; 
    z-index:2; 
}

來源

2013-07-18 12:56:17 smilebomb

回答

相關問題