我如何让我的CSS工作的屏幕分辨率？

Question

目前我的css将在一个分辨率上工作，然后当我尝试使用不同分辨率的屏幕编辑它时，它会改变它，看起来不一样。我添加了一个包装div，但它仍然在做，有人能帮我看看我做错了什么吗？任何建议将非常感谢！

这里是我的CSS全：

#Wrapper {height: 100%; 
width: 90%; 
margin-right: auto; 
margin-bottom: 1%; 
margin-left: auto;} 

#Title_Background {background: #3399FF; 
position: absolute; 
height: 15%; 
width: 98%; 
top: 0px; 
left: 0px; 
margin-right: 1%; 
margin-left: 1%; 
border-radius: 10px;} 

#Title h1 {font-family: Arial; 
font-size: 24px; 
color: black; 
position: relative; 
text-align: center; 
top: 20px;} 

#img1 {position: absolute; 
height: 2%; 
width: 4%; 
top: 22px; 
left: 51px;} 

#LeftNav {background: #3399FF; 
position: absolute; 
float: left; 
clear: left; 
height: 82%; 
width: 9%; 
top: 16%; 
left: 0px; 
border-radius: 10px; 
margin: 1%;} 

#LeftNav p {font-family: Arial; 
font-size: 18px; 
text-align: center; 
padding: 10px; 
margin-top: 90px; 
margin-right: 1%; 
margin-left: 1%; 
position: relative; 
border: 3px solid #000000; 
border-style: outset;} 

.Inset p {position: relative; 
border: 3px solid #000000; 
border-style: inset !important;} 

.Content {background: yellow; 
position: absolute; 
height: 60%; 
width: 72%; 
top: 250px; 
left: 14%; 
margin: 0 auto;} 

.Content p {font-family: Arial; 
font-size: 20px; 
top: 200px; 
text-align: center;} 

#RightNav {background: #3399FF; 
position: absolute; 
float: right; 
clear: right; 
height: 82%; 
width: 9%; 
top: 16%; 
right: 0px; 
border-radius: 10px; 
margin: 1%;} 

Answer 1

我认为你可能要考虑“响应式设计” 这里是一个文章： http://thinkvitamin.com/design/beginners-guide-to-responsive-web-design/ 并且你可以通过谷歌，ECT得到更多的。

简短摘要：结合使用一些技巧，您可以使您的网页适用于各种分辨率。

@media标记可以帮助您定位某些分辨率或范围，并调整大小或更改内容以适合您的需要。