Posizionare form

**KakashiZombie** · 04-06-2008, 20:03

ciao a tutti io ho 3 form che contengono 3 bottoni, i 3 bottoni li volevo allineare sulla stessa linea

codice:

<body onload="return importXML();" background="sfondo1.jpg" body vlink="white"body link="white">

<form  method='post' name='form1' id='form1' >
<h2><h1 align="center"> Questionario</h1></h2>
<hr>
<div id="Stampa"></div>
<hr>


<div align="center">
<h1 ><button input type="reset" value="Reset">Reset</button></h1></div>
</form>


<form onsubmit="return controllo()">
<div align="center">
<button input type="submit" name="invia" id="invia" value="Invia" >Correggi</button></div>

</form>

<form action="index.html">
<div align="center">
<button input type="submit" value="Cambia Materia"><font size=2>Cambia Materia</font></button></div>
</form>

è possibile quindi allineare i 3 form sulla stessa linea?

**ricman** · 05-06-2008, 09:10

Cioè...vuoi avere tre bottoni affiancati?
Se è così devi dare ai tag Form, da css, il "float: left;"

**KakashiZombie** · 05-06-2008, 15:41

e vome faccio? non sono pratico di css........perchè se poi do "align left" il bottone rimane nella riga sotto.....

**ricman** · 06-06-2008, 09:29

Originariamente inviato da KakashiZombie
e vome faccio? non sono pratico di css.....

...e di copia/incolla sei pratico?

Ti avevo scritto il css da usare e tu ne hai usato un altro!

**KakashiZombie** · 06-06-2008, 14:20

ok sono sulla stessa linea... ma a sinistra come li metto a centro schermo?

**KakashiZombie** · 07-06-2008, 14:35

UP
sono arrivato a questo punto....

codice:

<html>
 <head>
  <title>Questionario</title>
  <style type="text/css">
    h1      {color: #FFCC00;  font-size: 25px;  font-family: Verdana; }
    
    button  {width: 120px;  height: 35px; border: 0; float: left; cursor: pointer;  Text-align:center;  font:bold 20px/30px "Trebuchet MS",Arial,sans-serif;
            background: #55CB00 url(base.png) no-repeat 0 0;color:#FFF 
            }

    button:hover{background-position: 0 -35px;color: #FFC}
    button:active{background-position: 0 -70px;color: #FFF}
        
   td { background-color: #FFFFAF; font-size: 12px; font-family: Verdana; }
  </style>


  <SCRIPT LANGUAGE="JavaScript" src="questionario.js"></SCRIPT>
  </head>

  <body onload="return importXML();" background="sfondo1.jpg" body vlink="white"body link="white">
  
    <form  method='post' name='form1' id='form1' >
      <h1 align="center"> Questionario</h1>
      <hr>
        <div id="Stampa"></div>
      <hr>
      

      <div align="center">
        <h1 align="center"><button input type="reset" value="Reset">Reset</button></h1>
      </div>
    </form>
    
    <form onsubmit="return controllo()">
      <h1 align="center"><button input type="submit" name="invia" id="invia" value="Invia" >Correggi</button> 
    </form>
    
    <form action="index.html">
        <h1 align="center"><button input type="submit" value="Cambia Materia"><font size=2>Cambia Materia</button>
    </form>
    
  </body>
  
</html>

grazie alla tua istruzione sono allineati ma li volevo in centro....

**ricman** · 07-06-2008, 16:02

Originariamente inviato da KakashiZombie
grazie alla tua istruzione sono allineati ma li volevo in centro....

Racchiudi i form in un div e questo lo centri col metodo "margin: 0 auto" (trattato svariate volte in questi forum... basta che cerchi "centrare box" o "centrare div")

**KakashiZombie** · 07-06-2008, 17:03

non ci riesco.... ho messo quel margin: 0 auto;
ma niente, ho anche cercato se trovavo qualcosa, ma non trovo niente che parli dei form....
Se io racchiudo il primo button (reset) in un div , e gli altri 2 button in altri 2 div e gli do il metodo margin: 0 auto; in firefox non si allineano nemmeno sulla stesa linea, il primo è + in alto..... con explorer stanno sulla stessa linea ma non sono in mezzo allo schermo....
Se ha voi va è perchè ho sbagliato io, ma nn so ke cosa...

**ricman** · 08-06-2008, 09:56

Originariamente inviato da KakashiZombie
ma niente, ho anche cercato se trovavo qualcosa, ma non trovo niente che parli dei form....

Ti avevo detto cosa cercare ... ma hai cercato una altra cosa? Boh... cmq cosa sono i Form? ...sono tag come tutti gli altri... come i Div...

Originariamente inviato da KakashiZombie
Se io racchiudo il primo button (reset) in un div , e gli altri 2 button in altri 2 div e gli do il metodo margin: 0 auto; in firefox non si allineano nemmeno sulla stesa linea, il primo è + in alto..... con explorer stanno sulla stessa linea ma non sono in mezzo allo schermo....
Se ha voi va è perchè ho sbagliato io, ma nn so ke cosa...

Leggi meglio quello che avevo scritto... racchiudi I form in UN div. Cioè NON un div per ciascun form... ma UN div unico che racchiude i tuoi tre form.
Questo div lo centrerai rispetto al proprio contenitore, che può essere un altro div o il body stesso a seconda delle esigenze.

**KakashiZombie** · 08-06-2008, 10:48

codice:

  <body onload="return importXML();" background="sfondo1.jpg" body vlink="white"body link="white">
   <div margin: 0 auto> 
    
    <form  method='post' name='form1' id='form1' >
      <h1 align="center"> Questionario</h1>
      <hr>
       <div id="Stampa"></div>
      <hr>
       <button input type="reset" value="Reset">Reset</button>
    </form>
   
    <form onsubmit="return controllo()"><button input type="submit" name="invia" id="invia" value="Invia" >Correggi</button></form>
   
    <form action="index.html"><button input type="submit" value="Cambia Materia"><font size=2>Cambia Materia</button></form>
   
   </div>
  </body>

tu mi hai detto di farlo cosi giusto? ma cosi non va.....prova e vedi...

Discussione: Posizionare form

Strumenti discussione

Ricerca discussione

Visualizza

Posizionare form

Permessi di invio