problema: la select della città mi va a fondo pagina invece di stare a fianco

paperinik4

Utente Attivo
29 Mag 2011
1.811
0
36
Roma
www.ricetteagogo.it
Salve a tutti,


Ho un piccolo problema che mi sta facendo inmpazzire da qualche giorno tanto per cambiare. Ho sempre le due select famose. Ina citta e una provincia. Cosa succede ??? Quando metto la select citta, invece di affiancarmela vicino alla targhetta "Inserisci città: " e a fianco dovrebbe comparire la selezione delle città, mi va a fondo pagina. Mentre con la provincia va tutto bene e me lo mette a fianco. Non capisco come al solito dove sbaglio. QUesto è l'intero listato.


iscrizione.php

PHP:
<html>
    <head>
        <meta charset="UTF-8">
        <title>Modulo Iscrizione</title>
      
<style type="text/css"> 
    #areaTitolo{
   width:100%;
   height:100px;
   position:absolute;
   top:0px;
   left:5px;
   text-align: center;
  }
 
 #area img{
 width:20px;
 height:20px;
 position:relative;
 bottom:40px;
 left:180px;
}
#nascita {
 
  width:100%;
   height:100px;
   position:absolute;
   top:180px;
   left:110px;
  }   
  #datanascita {
 
  width:100%;
   height:100px;
   position:absolute;
   top:172px;
   left:5px;
  }   
#div {
    
position:absolute;
top: 70px;    
} 

#username{
    
position:absolute;
top: 190px;    
} 
#email{
    
position:absolute;
top: 250px;    
} 

#ripemail{
    
position:absolute;
top: 285px;    
} 
#password{
    
position:absolute;
top: 320px;    
} 
#rippass{
    
position:absolute;
top: 360px;    
} 
#citta{
    
position:absolute;
top: 400px;    
} 
#prov{
    
position:absolute;
top: 430px;    
} 
</style>
        
    </head>
    <!-- Sistema sulla stessa riga dove viene visualizzata la data attuale il titolo dela pagina -->
    
    <div id="areaTitolo"> <h3> BENVENUTI NEL MODULI D'ISCRIZIONE </h3>
        <hr />
    </div>
<!--Neccessario per posizionare i campi dopo il tag hr che disegna una riga orizzontale -->    
   
<div id="div">
        
       <!-- Inizia il modulo vero e proprio dell'iscrizione -->
       
       Cognome: <input type ="text" id="input1" name="cognome"/><div id="controllo1"><img src="" /></div> 
    <p> <p>
    Nome: <input type ="text" id="input2" name="nome/><div id="controllo2"><img src="" /></div>
    </p></p>
<p> <p>
<div id="datanascita">
    <label> Data di nascita: </label><img src="" /></div>
</p></p> </div>

<div id="username">

<p> <p>
    
    Username: <input type ="text" id="input3" name="nome/><div id="controllo3"><img src="" /></div>
    </p></p>

<p> <p>
    <div id="email">

    Email: <input type ="text" id="input4" name="nome/><div id="controllo4"><img src="" /></div>
    </p></p>

<p> <p>
    <div id="ripemail">

  Ripeti - Email: <input type ="text" id="input5" name="nome/><div id="controllo5"><img src="" /></div>
</p></p>


<p> <p>
    <div id="password">

    Password: <input type ="text" id="input6" name="nome/><div id="controllo6"><img src="" /></div>
    </p></p>


 <div id="rippass">

    Ripeti-Password: <input type ="text" id="input7" name="nome/><div id="controllo7"><img src="" /></div>
    </p></p>

  <div id="citta">

    <label for="citta">Seleziona Città: </label>
    <select id="citta" name="citta">
        <!-- Inizio elenco città -->
        <option value=””>-- Seleziona Citta --</option>
        <option value=””></option>       

        <option>Agrigento</option>
        <option>Alessandria</option>
        <option>Ancona</option>
        <option>Aosta</option>

     </select> </div>


    <!--Fine elenco città -->
    <div id="prov">

    <label for="provincia">Seleziona la Provincia:  </label>
    <select id="provincia" name="provincia">

        <!--Inizio elenco provincia -->

        <option value=””>-- Seleziona Provincia --</option>
        <option value=””></option>    

        <option >Ag</option>
        <option >Al</option>
        <option >An</option>
        <option >Ao</option>

    </select> </div>

</form>
    
<body>
        <?php
        require_once("connettimysqli.php");
        require_once("data.php");
 
        echo '<div id="nascita">';      
          //Giorno

                echo "<select name=\"giorno\" id='giorno' required autofocus><option value=\"\">Seleziona</option>";
                echo "<option value=\"\">  </option>";
                for($gg=1; $gg<=31; $gg++){
                for($gg=1; $gg<=31; $gg++){
                echo sprintf("<option value=\"%02d\"> %02d </option>\n", $gg, $gg);
             }
             }
             echo "</select>";
//Mese

             echo '<select name="mesi" id="mese" required autofocus><option value="">Seleziona</option>';
             echo "<option value=\"\">  </option>";

             $mesi = array (
                "1" => "Gennaio",
                "2" => "Febbbraio",
                "3" => "Marzo",
                "4" => "Aprile",
                "5" => "Maggio",
                "6" => "Giugno",
                "7" => "Luglio",
                "8" => "Agosto",
                "9" => "Settembre",
                "10" => "Ottobre",
                "11" => "Novembre",
                "12" => "Dicembre",
             );
             foreach( $mesi as $m => $mese ){
                echo "<option value=\"$m\">{$mesi[$m]}</option>";
             }
             echo"</select>";
            
            
             //Anno

            $da=1950;
            $al=date('Y');
            echo '<select name="anno" id="anno" required autofocus><option value="">Seleziona</option>';
            echo "<option value=\"\">  </option>";
            for($aa=$da; $aa<=$al; $aa++){
            echo "<option value=\"$aa\"> $aa </option>";
            }
            echo "</select>" ;
        ?>
 </div>
    
 </div>
</form>
    </body>
</html>


Ancora da terminare. E questa l'immagine che compare se si fa girare il modulo.

http://s16.postimg.org/h3x0lajph/Modulo_Iscrizione.png

Spero di ricevere aiuto e risposta come al solito. Ringrazio tutti anticipatamente.
 

migo80

Utente Attivo
25 Apr 2013
243
3
18
Ciao dal tuo listato mi sembra di vedere la chiusura del tag form ma non la sua apertura.
poi perchè usi quei tag p messi così per creare uno spazio vuoto esiste il tag <br/> e il tutto deve essere racchiuso tra i tag <body>..........</body>
HTML:
<html>
<head>
</head>
<body>

<div class="form">
    <form metod="post" action="#">
        <label>   Cognome:</label><input type ="text" id="input1" name="cognome"/><span id="controllo1"><img src="" /></span><br/>
        <label>   Nome:</label><input type ="text" id="input2" name="nome/><span id="controllo2"><img src="" /></span><br/> <!-- e così via per ogni campo -->
        ...........
       ..............
<input type="submit" name="invia" value="invia"/><!--questo serve per inviare i dati del form allo script php --->
    </form>

</div>
</body>
</html>
 

paperinik4

Utente Attivo
29 Mag 2011
1.811
0
36
Roma
www.ricetteagogo.it
Ciao grazie per la risposta. Sapevo che i Tag Br erano deprecabile e che per creare una riga vuota era meglio adoperare i Tag p che andavano a capo. Il Tag forma mi sembra che ci sia all'inizio peró posso ricordare male. Stamattina verificherà. Grazie per adesso.
 

paperinik4

Utente Attivo
29 Mag 2011
1.811
0
36
Roma
www.ricetteagogo.it
Ciao migo80,

Volevo sapere una cosa, ma secondo te è necessario mettere ogni classe per posizionare l'ogetto come ho fatto io ???? Oppure c'è un metodo più elegante che superata la riga mi vanno tutti giù sotto la riga ???? Mi sono accorto ora che i div citta e il nome della select coincidevano. modificato il nome del div da citta a cit è ritornato tutto alla normalià. Difatti la lista sta a fianco alla città come doveva essere. Inoltre avevi ragione non avevo aperto il form all'inizio. Grazie dell'aiuto. Il post si può chiudere con un risolto.
 
Ultima modifica:

migo80

Utente Attivo
25 Apr 2013
243
3
18
Scusa ma non riesco a capire cosa intendi a quali oggetti ti riferisci? per quanto riguarda il br ho ricontrollato e non è deprecato....
 

paperinik4

Utente Attivo
29 Mag 2011
1.811
0
36
Roma
www.ricetteagogo.it
Ciao migo80,

Strano sui manuali consigliano di adoperare il tag <p> per lasciare una riga il tag <br> dovrebbe servire per andare a capo. Comunque sia, quello che mi riferivo è questo style che ora ti riposto:

Codice:
<html>
    <head>
        <meta charset="UTF-8">
        <title>Modulo Iscrizione</title>
      
<style type="text/css"> 
    #areaTitolo{
   width:100%;
   height:100px;
   position:absolute;
   top:0px;
   left:5px;
   text-align: center;
  }
 
 #area img{
 width:20px;
 height:20px;
 position:relative;
 bottom:40px;
 left:180px;
}
#nascita {
 
  width:100%;
   height:100px;
   position:absolute;
   top:180px;
   left:110px;
  }   
  #datanascita {
 
  width:100%;
   height:100px;
   position:absolute;
   top:172px;
   left:5px;
  }   
#div {
    
position:absolute;
top: 70px;    
} 

#username{
    
position:absolute;
top: 190px;    
} 
#email{
    
position:absolute;
top: 250px;    
} 

#ripemail{
    
position:absolute;
top: 285px;    
} 
#password{
    
position:absolute;
top: 320px;    
} 
#rippass{
    
position:absolute;
top: 360px;    
} 
#citta{
    
position:absolute;
top: 400px;    
} 
#prov{
    
position:absolute;
top: 430px;    
} 
</style>
        
    </head>
    <!-- Sistema sulla stessa riga dove viene visualizzata la data attuale il titolo dela pagina -->
    
    <div id="areaTitolo"> <h3> BENVENUTI NEL MODULI D'ISCRIZIONE </h3>
        <hr />
    </div>
<!--Neccessario per posizionare i campi dopo il tag hr che disegna una riga orizzontale -->    
   
<div id="div">
        
       <!-- Inizia il modulo vero e proprio dell'iscrizione -->
       
       Cognome: <input type ="text" id="input1" name="cognome"/><div id="controllo1"><img src="" /></div> 
    <p> <p>
    Nome: <input type ="text" id="input2" name="nome/><div id="controllo2"><img src="" /></div>
    </p></p>
<p> <p>
<div id="datanascita">
    <label> Data di nascita: </label><img src="" /></div>
</p></p> </div>

<div id="username">

<p> <p>
    
    Username: <input type ="text" id="input3" name="nome/><div id="controllo3"><img src="" /></div>
    </p></p>

Come potrai vedere ogni targhetta è provvista di un suo tag e una sua distanza, altrimenti me la posiziona sopra in alto a sx del monitor. Comuqque mi sono accorto anche di un'altro errore. Ogni etichetta che ho fatto (copia e incolla modificando il nome dell'etichetta), non mi sono accorto di questo piccolo errore qua:

Codice:
name="nome/

Ossia in tutte le etichette hanno lo stesso name. Ora dopo che me ne sono accorto, le ho modificati tutti con i loro nomi ma mi si è crearo il panico nella pagina. devo capire il perchè.
 

migo80

Utente Attivo
25 Apr 2013
243
3
18
Se ricrei il form seguendo le indicazioni che ti avevo dato, tutto quel css non ti serve.... anche perchè dando il position absolute questi elementi si andranno a posizionare in maniera assoluta rispetto al primo contenitore con pisition relative "in sua assenza, per default sarà l'area del browser e di conseguenza si andranno a posizionare in alto a sinistra.
 
Discussioni simili
Autore Titolo Forum Risposte Data
L problema con query select PHP 2
T problema con select dinamica con jquery Javascript 0
M [PHP] Problema con query select PHP 2
T [php] problema creazione query select-where PHP 5
webmachine [PHP][MYSQL] Problema con le SELECT PHP 5
webmachine [PHP] Problema: Stampare tutte le occorrenza di una SELECT PHP 2
H problema con select dinamiche e javascript Javascript 0
F Problema attivare/disattivare immagine calendario datepicker da select jQuery 1
I problema <select> PHP 0
R Problema Select Php PHP 0
F Problema selezione dinamica select/jsp/mysql Javascript 0
P Problema multi select form jQuery 6
Virginia86 [risolto] Problema select e verifica form PHP 38
A Problema recupero valori da select con chiamata ajax Ajax 1
B problema select PHP 3
H Problema con MySQL e PHP, dopo aver fatto una SELECT non ottengo alcun risultato PHP 7
L Problema Select con Javascript e nodi Dom XML. Javascript 0
S Problema con inserire la select in un array PHP 2
L problema option select senza database PHP 2
E problema con select dinamica - doctype - ie ASP.NET 4
S Problema con 2 funzioni:array,select dinamica Javascript 21
E problema di sintassi su una select (plugin) PHP 5.3 PHP 3
EffeElle Php problema query select PHP 5
T Problema con select dinamica Javascript 2
M problema con il tag <select> PHP 3
F Problema select dinamiche con php e jquery jQuery 1
C Problema con il select PHP 1
P problema passaggio valore javascript a select su pagine php Javascript 0
C Problema SELECT, AND, OR PHP 2
S Problema gestione select multipla Javascript 0
M problema con select jquery e php PHP 0
M problema select autoaggiornata Ajax 0
S Problema select su recordset nidificati Classic ASP 5
U Come risolvo questo problema col pulsante SELECT?? PHP 1
P Problema UNION ALL SELECT PHP 3
M Select scelta sottofondo - problema firefox Javascript 1
A Problema: creare nuove "option" di una select-list con javascript Javascript 1
R Problema su select Javascript 1
I Sto progettando nuovi siti utilizzando bootstrap e devo dire funziona bene, l'unico problema e la maschera -moz- HTML e CSS 0
K Problema form update PHP 2
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
S Problema nel ciclare un json Javascript 0
G Problema con Xampp Web Server 1
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
K Problema Inner join PHP 1
F firefox problema http Linux e Software 0
N Problema con position absolute e overflow HTML e CSS 4
E Problema jquery Success jQuery 2
L Problema con inner join PHP 11

Discussioni simili