2013-04-29 110 views
0

我有一個登錄頁面在瀏覽器最大化時運行良好。但是當我調整它的大小時,元素開始四處流淌。我已經做了一些研究,我發現這一點:瀏覽器最大化時應用CSS?

#wrapper { /*It will contain all the elements.*/ 
    margin-left: auto; 
    margin-right: auto; 
    min-height: 500px; 
    min-width: 500px; 
} 

它的工作原理,但由於我設置最小高度和最小寬度,有些屏幕分辨率將迫使瀏覽器應用的滾動條,即使它被最大化了。有沒有辦法只在用戶調整瀏覽器大小時才顯示滾動條?

+3

你可以使用一些mediaqueries。 @media screen和(min-width:500px){}。這裏面的CSS只適用於瀏覽器大小超過500px的情況。 – crazyrohila 2013-04-29 14:34:18

回答

1

爲什麼不只是將最小高度設置爲400px?

這將允許所有分辨率以顯示沒有滾動

在網頁(最小RES:640x460) - >640 px寬度和高度460 px

整體,你不能強迫瀏覽器不顯示滾動條,同時保持滾動功能(至少在沒有一些框架)

+0

嗯,我想我會把它設置爲1024x768 ....我認爲用戶擁有640x480顯示器的機率很小xD 謝謝! – Jvam 2013-04-29 14:47:05

+0

有很多設備在那裏是小於400px(提示:他們適合在你的手掌)。 – cimmanon 2013-04-29 14:54:48

+0

@cimmanon那麼這是一個完全不同的故事,因爲他們有2個視口,請參閱http://www.quirksmode.org/mobile/viewports2.html因此你的論點是無效的...... Jvam:關心內部瀏覽器res不是屏幕res! – Vogel612 2013-04-29 14:57:26

0

如果你的內容允許的話,你可以只讓事情變得更靈活,這樣的事情:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 

<style media="all"> 
div {background: red; width: 40em; padding: 1em; margin: 0 auto; max-width: 100%;} 
</style> 

</head> 
<body> 

<div> 
    <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p> 
</div> 

</body> 
</html>