JSFiddle - React, Tailwind, and code Playground

HTML

<div class="login">
				<div class="block">Benutzername:</div>					<div class="block"><input name="user" size="20"></div>
				<div class="block">Passwort:</div>
        <div class="block"><input type="password" name="passwrd" size="20"></div>
					<div class="block">Minuten angemeldet bleiben:</div>
					<div class="block"><input name="cookielength" size="4" maxlength="4" value="60"></div>
					<div class="block">Immer angemeldet bleiben:</div>
					<div class="block"><input type="checkbox" name="cookieneverexp" data-eve="2"></div>
</div>

CSS

.login {
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0

}
.login block {
  float: left;
}
@media screen and (min-width: 900px) {
    .login .block{
      float: none;
    }  
  }
  @media screen and (min-width: 500px){
   .login {
     text-align: center;
   }
  .login .block{
      float: left;
      width: 50%;
        padding: 0;
    margin: 0
  }
  .login .block:nth-child(1n) {
    text-align: right;

  }
  .login .block:nth-child(2n) {
    text-align: left;
    clear: rigth;
  }
}