Champ de texte ( Formulaire )

ciranox 9 -  
Bonjour,

J'ai crée un formulaire de contact sur photoshop.Je voudrais insérer un champ de texte sur la photo.Quand je fais insérer le champ de texte se positionne à l'extérieure de la photo.

Comment faire que je puisse le positionner sur la photo?

Merci d'avance .

6 réponses

  1.  Hoeneim
    Ton image doit être en arrière plan.
    0
    1. ciranox 9 Auteur
      Merci de m'avoir répondu.

      Mon image est déjà en arrière plan .
      0
      1. Hoeneim
        A quoi ressemble le code ? D'après ce que tu dis dans ton premier message j'ai beaucoup de mal à imaginer ce que tu as fais.
        0
        1. ciranox 9 Auteur
          Il y a pas beaucoup de code parce le Design du formulaire à été fait sur photoshop.

          Je voudrais positionner un champ de texte sur l'image .

          code html:

          <body>

          <div id="main">
          <div id="test_image_formulaire_aplatir">
          </div>
          <form id="form1" name="form1" method="post" action="">
          nom
          <input type="text" name="nom" id="nom" tabindex="1" />
          </form>
          <br class="clearfloat" />
          </div>

          code css:

          body {
          background-color: #ffffff;
          margin:0px;
          padding:0px;
          }
          .p {
          margin:0px;
          padding:0px;
          font-size: inherit;
          font-family: inherit;
          font-weight: inherit;
          text-align: inherit;
          color: inherit;
          line-height: inherit;
          vertical-align: top;
          }
          p {
          padding-top:0px;
          margin-top:0px;
          }
          img {
          border:0px;
          }
          div {
          margin:0px;
          padding:0px;
          font-family:verdana; font-size:12px;
          }
          .AbsWrap {
          width: 100%;
          position: relative;
          }
          .rowWrap {
          width: 100%;
          }
          .clearfloat {
          clear:both;
          height:0px;
          }
          a:link, a:visited{
          COLOR:inherit;
          text-decoration:inherit;
          }
          #main {

          width:540px;
          margin: 0px auto 0px 0px;
          border: 0px solid #f0f0f0;

          }
          #test_image_formulaire_aplatir {
          margin-left:0px;
          margin-top:0px;
          width:540px;
          height:369px;
          margin-bottom:0px;
          float:left;
          display:inline;
          background-image: url(images/test%20image%20formulaire%20aplatir%20.gif);
          overflow:hidden;

          }
          0
          2. Hoeneim
            Ta div "<div id="test_image_formulaire_aplatir"></div> est vide donc effectivement elle ne contient pas ton formulaire.

            Ce code devrait fonctionner. 
            <div id="main">
<div id="test_image_formulaire_aplatir">
<form id="form1" name="form1" method="post" action="">
nom
<input type="text" name="nom" id="nom" tabindex="1" />
</form>
<br class="clearfloat" />
</div></div>


            Tu peux aussi virer ta div "test_image_formulaire_aplatir" et paramétrer ton css pour que l'image apparaisse dans la div "main".
            0
            1. ciranox 9 Auteur
              Merci beaucoup ça marche

              (problème résolu).
              0