Problème pour relié mon code css et html

Bonjour, je suis entrain de créer un site et je dois faire un formulaire et j'en est trouvé un sur internet deja tout faire. Le pbl est que le code en question a un code html et css separé j'aimerai faire copié collé sur une nouvelle page Notepad++ pour voir ce que cela donne avant de l'intégrer sur mon site.
Voici le code:
CSS:

#container {
    width:780px;
    margin:0 auto;
    position: relative;
}

#content {
    width:520px;
    min-height:500px;
}
a:link, a:visited {
    color:#27b;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
a img {
    border-width:0;
}
#topnav {
    padding:10px 0px 12px;
    font-size:11px;
    line-height:23px;
    text-align:right;
}
#topnav a.signin {
    background:#88bbd4;
    padding:4px 6px 6px;
    text-decoration:none;
    font-weight:bold;
    color:#fff;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;


*background:transparent url("images/signin-nav-bg-ie.png") no-repeat 0 0;

*padding:4px 12px 6px;
}
#topnav a.signin:hover {
    background:#59B;


*background:transparent url("images/signin-nav-bg-hover-ie.png") no-repeat 0 0;

*padding:4px 12px 6px;
}
#topnav a.signin, #topnav a.signin:hover {


*background-position:0 3px!important;
}

a.signin {
    position:relative;
    margin-left:3px;
}
a.signin span {
    background-image:url("images/toggle_down_light.png");
    background-repeat:no-repeat;
    background-position:100% 50%;
    padding:4px 16px 6px 0;
}
#topnav a.menu-open {
    background:#ddeef6!important;
    color:#666!important;
    outline:none;
}
#small_signup {
    display:inline;
    float:none;
    line-height:23px;
    margin:25px 0 0;
    width:170px;
}
a.signin.menu-open span {
    background-image:url("images/toggle_up_dark.png");
    color:#789;
}

Le code HTML:

<divid="container">
  <divid="topnav"class="topnav"> Have an account? <ahref="login"class="signin"><span>Sign in</span></a> </div>
  <fieldsetid="signin_menu">
    <formmethod="post"id="signin"action="[https://twitter.com/sessions]">
      <labelfor="username">Username or email</label>
      <inputid="username"name="username"value=""title="username"tabindex="4"type="text">
      </p>
      <p>
        <labelfor="password">Password</label>
        <inputid="password"name="password"value=""title="password"tabindex="5"type="password">
      </p>
      <pclass="remember">
        <inputid="signin_submit"value="Sign in"tabindex="6"type="submit">
        <inputid="remember"name="remember_me"value="1"tabindex="7"type="checkbox">
        <labelfor="remember">Remember me</label>
      </p>
      <pclass="forgot"> <ahref="#"id="resend_password_link">Forgot your password?</a> </p>
      <pclass="forgot-username"> <Aid=forgot_username_link 
title="If you remember your password, try logging in with your email"
href="#">Forgot your username?</A> </p>
    </form>
  </fieldset>
</div>

EDIT : Ajout des balises de code (la coloration syntaxique). Explications disponibles ici : ICI Merci d'y penser dans tes prochains messages.