我无法弄清楚为什么不应用我的 div 样式。这一定是非常简单明了的事情，但对我来说不是，不是今天。
这是一个非常简单的登录页面。
HTML：
<div id="form_wrap">
<div id="logo">
<a href="#" title="#" id="logg">
<img src="./images/smaple.png" alt="sample" />
</a>
</div>
<form name="login-form" class="login-form" action="#" method="post">
<div class="form_content">
<input name="username" type="text" class="input username" placeholder="Benutzername" />
<input name="password" type="password" class="input password" placeholder="Passwort" />
<input name="submit" type="submit" class="button" value="Anmelden"/>
</div>
</form>
</div>
<div id="langchoice">
<span id="triangle"></span>
<select id ="langlist">
<option value= "1">Deutsch</option>
<option value = "2">Englisch</option>
</select>
</div>
和 CSS（一些小的背景渐变更改以避免代码意大利面条）：
*{
margin:0;
padding:0;
border: none;
outline: none;
}
/* apply a natural box layout model to all elements */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html{
background:#193358 url('images/bckg.jpg') repeat;
/* Ensure the html element always takes up the full height of the browser window */
min-height:100%;
height: 100%;
}
body{
/* Workaround for some mobile browsers */
height: 100%;
min-height:100%;
background: #333;
}
a, a:visited {
outline:none;
color:#1c4f64;
}
a:hover{
text-decoration:none;
}
section, footer, header{
display: block;
}
#logo {
text-align: center;
}
#form_wrap {
/* Center wrapper perfectly */
width: 440px;
height:400px;
margin: 275px auto;
z-index:2;
clear:both;
}
header{
background: #333;
background-repeat: repeat-x;
width: 100%;
height:300px;
color: white;
z-index: -1;
position:fixed;
top: 0;
left: 0;
}
.login-form {
width: 435px;
height: 320px;
margin: 20px auto 0;
padding: 50px 110px 60px;
position: relative;
background: #f2f3e7;
border: 0.5px solid rgba(0, 0, 0, 0.4);
border-radius: 12px;
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6) inset;
-moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6) inset;
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6) inset;
}
/* Input field */
.login-form .form_content .input {
width: 188px;
padding: 12px 25px 8px;
font-family: 'superficial_book';
font-weight: 400;
font-size: 14px;
color: #9d9e9e;
text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
background: #dfdfde;
border: 1px solid #fff;
border-radius: 10px;
box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
}
/* Second input field */
.login-form .form_content .password, .login-form .form_content {
margin-top: 25px;
}
.login-form .form_content .input:hover {
background: #d3e3e4;
color: #416e75;
}
.login-form .form_content .input:focus {
background: #d3e3e4;
color: #416e75;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
}
/* Animation */
.input, .button, .langchoice {
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
}
/* Login button */
.login-form .button {
position: relative;
padding: 8px 60px;
margin: 25px auto;
font-family: 'superficialbold';
font-weight: 300;
font-size: 14px;
color: #e3e3d5;
display: inline-block;
text-align: center;
text-shadow:1px -1.5px rgba(0, 0, 0, 0.5), 0 0px rgba(57, 128, 148, 0.5), 0 0 rgba(255, 255, 255, 0.2), 0 1px rgba(0, 0, 0, 0.3);
text-decoration: none;
background:#156785 url('images/button_bckg.gif') repeat-x ;
border-radius: 10px;
cursor: pointer;
box-shadow: 0 1px 2px #fff inset, 0 2px 0 0 #156785, 0 5px 3px #999;
-moz-box-shadow: 0 1px 2px #fff inset, 0 2px 0 0 #156785, 0 5px 3px #999;
-webkit-box-shadow: inset 0px 1px 0px #333, 0px 2px 0px 0px #156785, 0px 5px 3px #999;
}
.login-form .button:hover, .login-form .button:focus,.login-form .button:active {
border: 1px solid rgba(256,256,256,0.3);
box-shadow: 0 1px 0 #333 inset,0 1px 0 #333;
-moz-box-shadow: inset 0px 1px 0px #333;
-webkit-box-shadow: inset 0px 1px 0px #333;
color: #f6f4e7;
padding: 7px 60px;
position: relative;
top:-1px;
text-shadow:1px -1.5px rgba(0, 0, 0, 0.5), 0 0px rgba(57, 128, 148, 0.5), 0 0 rgba(255, 255, 255, 0.2), 0 1px rgba(0, 0, 0, 0.3);
}
div#langchoice {
position: absolute;
top: 200px;
left: 200px;
width:140px;
height:34px;
background-color:#F1BD4B;
margin-left: -8px;
padding:2px 10px;
-webkit-border-radius: 1px 8px 8px 1px;
border-radius: 1px 8px 8px 1px;
border:0;
-webkit-box-shadow: 1px 2px 2px 0px rgba(23, 34, 23;)
box-shadow: 1px 2px 2px 0px rgba(23, 34, 23;)
z-index: 10;
}
在这里开玩笑：http: //jsfiddle.net/yp5yw/