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.

1 réponse

  1. Dans le code html de ta page formulaire, il faut lier la feuille de style.
    Exemple à mettre dans ton code html:

    <link href="/NOM-DE-TON-FICHIER-CSS.css" rel="stylesheet" type="text/css" />

    - Donne un nom à ton fichier de style css et enregistre-le sous .css
    - Ensuite met le code indiqué ci-dessus dans ta page html dans l'en-tête, à savoir entre les balises HEAD, pas dans le BODY.