Champ de texte ( Formulaire )

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

  • Votes
  • Date
  • Date décroissante
  1. Merci de m'avoir répondu.

    Mon image est déjà en arrière plan .
    1. 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.
      1. 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;

        }
        1. 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".