Valutazione discussione:
  • 0 voto(i) - 0 media
  • 1
  • 2
  • 3
  • 4
  • 5
Form centrato responsive
#1
Ciao Mattia,
ho bisogno di fare una "finta" pagina di inserimento password che dà sempre "password non corretta" come risposta.
Ho deciso di fare una index.html così strutturata:
Codice:
<html>
<head>
<title>Extra Contents</title>
<link href="css/stile.css" rel="stylesheet" type="text/css" />
</head>
<body class="bg-gray">
<div class="content">
            <div class="text">
                 Enter the password to view the extra contents<br /><br />
                 <form id="form" name="">
                 </form><INPUT id="form" value=""><input id="input" type="submit" value="Enter"><br /><br />
                 Password
  </div>
            
        </div>



</body>
</html>
cliccando su "Enter" si collega alla pagina wrong.htm:
Codice:
<html>
<head>
<title>Extra Contents</title>
<link href="css/stile.css" rel="stylesheet" type="text/css" />
</head>
<body class="bg-gray">
<div class="content">
    <div class="box">
            <div class="text">
                 Invalid Password <br /><br />
                 <input id="input" type="submit" value="Ok">
  </div>
      </div>    
        </div>



</body>
</html>
Il css è così composto:
Codice:
/* Fonts Styles */


@font-face {
    font-family: "couriernew";
    src: local("couriernew"), local("Couriernew"), url("couriernew.ttf") format("truetype");
}


h1,h2,h3,h4,h5,h6 {

    font-family: "couriernew",Trebuchet MS, Arial, Helvetica, sans-serif;

}

.bg-gray{
    background-color:#cecece;
}

.content{
    position:relative;
    width: 608px;
    height: 236px;
}

.content .text{
        position:relative;
        align: center;
        margin:10px 0;
        padding:10px 30px;
        font-family:"couriernew", Arial, Helvetica, sans-serif;
        font-size: 16px;
}

.content .box{
    position:relative;
    align: center;
    background-image: url(../imgs/box.jpg);
    background-repeat: no-repeat;
    width: 608px;
    height: 236px;
}
#form {
    position:relative;
    font-family: "couriernew", Trebuchet MS, Arial, Helvetica, sans-serif;
    font-size: 16px;
    width: 150px;
    background-color: #cecece;
    border:#fff000 thin;
    border: 1px;
}
#input {
    position:relative;
    font-family: "couriernew", Trebuchet MS, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #000;
     width: 80px;
    background-color: #cecece;
    border:#FF0 outset;
    border: 1px;
}

Adesso, dato che le due pagine dovrò visualizzarle da un ipad, occorrerebbe che fossero in responsive... quindi cosa occorre modificare per renderle in responsive?
ti allego 3 immagini per farti vedere come dovrebbero venire
[Immagine: temp_01.jpg]
[Immagine: temp_02.jpg]
[Immagine: temp_03.jpg]
come puoi vedere nella terza immagine, cliccando sul form di inserimento password dovrebbe essere più alto della tastiera dell'ipad (onde evitare che lo copra).
Credo sia tutto... ti rpego di farmi sapere

Grazie
Cita messaggio


Messaggi in questa discussione
Form centrato responsive - da Chandler - 27/11/2013 19:57
RE: pagina in responsive - da Mattia - 28/11/2013 14:20
RE: pagina in responsive - da Chandler - 28/11/2013 15:30
RE: pagina in responsive - da Mattia - 29/11/2013 18:25
RE: Form centrato responsive - da Chandler - 30/11/2013 01:32
RE: Form centrato responsive - da Mattia - 30/11/2013 11:39
RE: Form centrato responsive - da Chandler - 30/11/2013 12:54
RE: Form centrato responsive - da Mattia - 01/12/2013 09:24
RE: Form centrato responsive - da Chandler - 01/12/2013 14:55
RE: Form centrato responsive - da Mattia - 01/12/2013 17:28
RE: Form centrato responsive - da Chandler - 01/12/2013 23:37

Discussioni simili
Discussione Autore Risposte Letto Ultimo messaggio
  rendere responsive pagina web app Chandler 41 109.206 17/01/2015 01:55
Ultimo messaggio: Chandler
  rendere pagina responsive Chandler 2 7.295 13/12/2014 21:55
Ultimo messaggio: Chandler
  sito in parallax responsive Chandler 9 52.664 27/06/2014 12:18
Ultimo messaggio: Mattia
  Responsive Filemanager: sovrascrivere immagini con drag & drop Chandler 13 23.734 19/06/2014 21:44
Ultimo messaggio: jimmyfm

Vai al forum:


Utenti che stanno guardando questa discussione: 1 Ospite(i)