当我恢复页面时，网页元素会移动

当我的浏览器（Firefox）屏幕最大化时，每次浏览我的网页时都是好的。但是，当我恢复（与最大化相反）屏幕时，我的UL列表项目重新定位自己以前的位置。我寻找解决方案，并发现我的想法。从我读的时候，我应该使用绝对的位置。当我这样做时，我没有运气。然后我试图“清楚：都”，但也无济于事。有人可以阐明为什么会发生这种情况吗？下面的HTML是我正在使用的。然后，你会看到的CSS是你看到我链接到的外部CSS文件。

当我恢复页面时，网页元素会移动

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>QuipStir</title> 
<link rel="stylesheet" href="css/alltrimmings.css"> 
<link rel="stylesheet" href="css/reset.css"> 
    <meta name="description" content="Users "> 
<style> 
</style> 
<script> 
    document.createElement('header'); 
    document.createElement('nav'); 
    document.createElement('section'); 
    document.createElement('article'); 
    document.createElement('aside'); 
    document.createElement('footer'); 
</script> 
</head> 
<body> 
<div class="wrapper"> 
<header> 
<div id="header_list"> 
<ul>   
<li><a href="profile.php">MY PROFILE</a></li> 
    <li><a href="profile.php">NEST UPDATES</a></li> 
    <li><a href="profile.php">FEATURED UPDATE</a></li> 
    <li><a href="profile.php">OCCUPATION INFORMATION</a></li> 
    <li><a href="profile.php">MESSAGES</a></li> 
    <li><a href="profile.php">MY PERSONALITY</a></li> 
    <li><a href="profile.php">MY PET</a></li> 
    <li><a href="profile.php">EDIT PROFILE</a></li> 
<li><a href="account.php">ACCOUNT</a></li>   
<li><a href="help.php">HELP</a></li> 
<li><a href="index.php">LOG OFF</a></li> 
</ul> 
    </div> 
<h4>Quip-Stir</h4> 
</header> 
</div> 
</body> 
</html> 


//Below is where my external CSS begins. Thank you all for any help you can provide. 




html, 
body{ 
width:100%; 
height:100%; 
max-width:1600px; 
min-width:320px; 
} 

body { 
background-color:#EBECE4; 
} 



header{ 
background-color:#8b2323; 
-moz-box-shadow: 0px 1px 1px 0px rgb(58,78,70); 
    -webkit-box-shadow: 0px 1px 1px 0px black; 
    box-shadow:   0px 1px 1px 0px black; 
    height:23px; 
} 

h4{ 
color:#FFE7BA; 
margin:0px; 
font-style:italic; 
} 


#header_list ul { 
margin: 0px 0px 0px 0px; 
float:right; 
} 


#header_list ul li{ 
display:inline; 
} 

    #header_list ul li a:hover{ 
    color: white; 
    background-color:grey; 
    } 

    #header_list ul li a{ 
    Font-size:12px; 
    font-weight:bold; 
    font-family:"Times New Roman", Times, serif; 
    text-decoration:none; 
    padding:5px 12px; 
    color:#FFF8DC; 
    text-shadow: 0px 1px 1px black; 
    height:10px; 
    }

来源

2013-11-28 user3030416

顺便说一句，当它重新定位了UL列表中的项目，它迫使仍然符合规定区域内的其他人在他们下面。再次感谢。 – user3030416