如何在html中修復div的位置？

當我放大，縮小我的網頁時，所有div和物品的位置都會受到干擾。當我再次將縮放比例重置爲100％時，它會很好。即使在大屏幕筆記本電腦中打開相同頁面時也會出現此問題。 How can I fix the div position.一些我的CSS的代碼 -如何在html中修復div的位置？

/* hbg */ 
.hbg { 
background-color:transparent; 
float:left; 
margin:2px 0 0 45px; 
padding:65px 456px 0 56px; 
width:137px; 
height:190px; 
background:#fff url(images/hbg_img.jpg) no-repeat top left; 
} 

/*solutions*/ 
.solu{ background-color:transparent;} 
.solu_resize { margin:0 auto; padding:0; width:auto;} 
.solu .smenu ul { margin:0 0 0 45px; padding:0; float:left; width:auto; list-   style:none;} 
.solu .smenu ul li { margin:0 0; float:left;} 
.solu .smenu ul li a { display:block; margin:0; padding:0; color:#5f5f5f; text- decoration:none;} 
.solu_resize img{ float:left; padding:0 0 0 0;} 
........

來源

2010-06-22 nectar

你能告訴什麼樣的變化一些屏幕截圖在你的網頁上？ – 2010-06-22 10:28:35

放大和縮小意味着不同瀏覽器上的不同內容。例如在FF上，您可以放大「純文本」。當縮放功能影響文字大小時，絕對位置div會像您看到的那樣亂成一團。

您可以通過將您的頁面設計爲「有彈性」來解決此問題。您可以使用「em」單位定義座標和測量值，而不是使用像素。 em等於瀏覽器的默認文本大小，通常爲16px。爲了使生活更輕鬆，重置EM通過將以下在樣式表爲10px：

body { 
font-size: 62.5%; 
}

如果上面的代碼是在您的樣式表，您可以將您的像素轉換爲EM容易被除以10，每個像素值。例如，使用上面的代碼：

margin:.2em 0 0 4.5em; 
padding:6.5em 45.6em 0 5.6em; 
width:13.7em; 
height:19em;

這應該可以解決縮放問題，還可以讓人們在查看頁面時更改文本大小。這不適合你的精靈，你可能仍然遇到重疊的問題。如果它變得混亂，你可能不得不考慮改變你的佈局方法。如果您遇到重疊問題，建議您在所有div上使用overflow:hidden，並在適當情況下指定max-height和max-width。

如果您需要了解更多關於EMS和彈性的設計，這裏有一個很好的教程：http://jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css

而且這裏的一對最大高度的W3參考： http://www.w3schools.com/Css/pr_dim_max-height.asp

來源

2010-06-29 02:12:08 Kyle

這是因爲浮動元素提供絕對的寬度。如果更改屏幕大小，則元素似乎未排序，因爲它們仍然是指定的大小。也許大小定義的百分比可以幫助你解決這個問題。

來源

2010-06-22 10:29:03

如何在html中修復div的位置？

回答

相關問題