Aumentare la dimensione dei caratteri in un form "input"

**Piermy** · 08-04-2020, 16:38

Ciao a tutti,
ho provato a mettere in pratica quanto spiegato qui ma invano:
https://forum.mrwebmaster.it/threads...o-input.23474/

In sostanza il mio file modificato è:

codice:

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<style>
<!--
input{
height:auto;
font-size:200%;
}
-->
</style></head>
<?
ini_set('default_charset', 'utf-8'); 
?>
<table>
<tr>
<td>
<? include("search.php"); ?>
</td>
<td>
<b>Ricerca per genere:</b>
<? include("search_genere.php"); ?>
</td>
</tr>
</table>
</body>
</html>

potete aiutarmi ?
Grazie in anticipo
Pier Mario

**Vincent.Zeno** · 08-04-2020, 16:42

visto che tratti l'aspetto client, posta solo l'html prodotto. la parte dinamica (nel tuo contesto php) non ci aiuta ad aiutarti.

**Piermy** · 08-04-2020, 17:04

Attualmente ho questo risultato ma il testo nell'input è troppo piccolo e vorrei aumentarlo:
https://www.libriantichicavallero.com/cerca.php

**Piermy** · 09-04-2020, 12:39

Ho inserito questo e funziona:

codice:

<head>
<style type="text/css">

input[type="text"] {font-size: 100%; padding:5px 10px;}

</style>
</head>

Ora dovrei però aumentare anche la dimensione dei caratteri nel form dove è scritto "Scegli il genere" (menù a tendina) ma non funziona inserendo il codice appena postato

**Piermy** · 15-04-2020, 18:32

Per cortesia mi date una mano, è da 5 ore che cerco di impostare la dimensione corretta degli oggetti su queste 2 pagine invano:
https://www.libriantichicavallero.com/cerca.php
https://www.libriantichicavallero.co...desiderata.php

questo il file style.css:

codice:

body
{
float:left;
font-family: trebuchet ms, verdana, arial, tahoma;
font-size: 100%; color: black;
background-color: #ffffff;
line-height: 200%;
margin-top: 0px;
background: #ffffff url('images/bg.gif') top center repeat-x;
}

#border
{
border: 0px ;
width: 1300px;
background-color: #FFFFFF;
background:url('images/backround2.gif') no-repeat;
margin: 0 auto;
}

#header_ita
{
height: 190px;
border-bottom: 1px solid #669900; 
background-image:url('images/header_ita.jpg');

}

#header_eng
{
height: 190px;
border-bottom: 1px solid #669900; 
background-image:url('images/header_eng.jpg');
}

#content
{
padding: 0.5em 0.2em;
max-width: 1500px;
background-color: #FFFFFF;
}

#container
{
width: 1150px;
margin: 0px auto;
background-color: #ffffff;
border: 0px solid #669900;
}

.splitright {
background: #ffffff url('images/menu.gif') top center no-repeat;
width: 20%;
float: right;
overflow: hidden;
text-align: center;
}

.splitleft {
background: #ffffff;
margin:auto;
width: 80%;
float: left;
overflow: hidden;
text-align: justify;
font-size: 22px;
}

#introduction{
    float:right;
    width:200px;
    padding:0px 0px;
    margin:20px 0 20px 20px;
    background: url(images/menu.gif) no-repeat;
    text-align:center;
    line-height:1.9em;
    color:green;
    font-size:1.35em;
    font-family:"Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
    letter-spacing:0px;
}


#introduction ul, #introduction li {
text-align:center;
    list-style: none;
    margin: 0;
    padding: 0;
}

#introduction a {border-bottom: none; color:black;}

#introduction h1{
    text-align: center;
    position:static;
}

#introduction a:link    {color:green; text-decoration: none;}
 
#introduction a:hover   {color:sienna; text-decoration: none;}

#introduction a:visited {color:red; text-decoration: none;}

#introduction a:active  {color:red; text-decoration: none;}



/* ~~~~~~~~~ footer ~~~~~~~~~ */
#footer
{
    text-align: center;
    height: 30px;
    background-color: #F5FAF5;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #CCCCCC;
    margin-top: 50px;
    margin-right: 15px;
    margin-bottom: 0;
    margin-left: 15px;
    padding-top: 0;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
    clear: both;
    
}



#footer a:link    {color:#808080; text-decoration: none;}
 
#footer a:hover   {color:sienna; text-decoration: none;}

#footer a:visited {color:black; text-decoration: none;}





a:link    {color:green; text-decoration: none;}
 
a:hover   {color:sienna; text-decoration: none;}

a:visited {color:red; text-decoration: none;}

a:active  {color:red; text-decoration: none;}


/* ~~~~~~~~~ PROPS FOR THE MENU GO OUT TO EXPLODING-BOY.COM ~~~~~~~~~ */

    #topmenu {
    position: relative;
    top: 8px;
    left: 2px;
    width: 1360px;
    font-size:135%;
    margin: 0;
    line-height:normal;
    height: 42px;
      }
    #topmenu ul {
      margin:0;
      padding:0px 0px 0 2px;
      list-style:none;
      }
    #topmenu li {
      display:inline;
      margin:0;
      padding:0 0 0 1px;
      }
    #topmenu a {
      float:left;
      background:url(images/menuleft.gif) no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #topmenu a span {float:left; 
      display:block; 
      background:url(images/menuright.gif) no-repeat right top; 
      padding:5px 36px 4px 6px;
      color:green;
      }
    






  
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #topmenu a span {float:none;}
    /* End IE5-Mac hack */
#topmenu a:hover span {color:sienna;}




#topmenu a:visited span {color:red;}




    #topmenu a:hover {
      background-position:0% -42px;
      }
    #topmenu a:hover span {
      background-position:100% -42px;
    }





/* ~~~~~~~~~ Headings ~~~~~~~~~ */    
h1{
    color:green;
    font-family:geneva,arial,sans-serif;
    font-weight:normal;
    text-transform:uppercase;
    word-spacing:4px;
    letter-spacing:2.8px;
    font-size:0.8em;
    font-weight:bold;
    padding:0 0px;
    margin:0;
}

/*~~~~~~~~~~~styles~~~~~~~~~~~~~~~*/

.style4 {font-size: 18px}
.style5 {
    font-size: 12px;
    color: #CCCCCC}






.contenuto-centrato {
  text-align: center;
}
.tabella-centrata {
  margin-left: auto;
  margin-right: auto;
}




/*~~~~~~~~~~~tabelle~~~~~~~~~~~~~~~*/
table 

{
border-collapse:collapse
text-align: center;
}

td, th {
border:1px solid #ddd;
padding:8px;
text-align:center;
}





div.container4 {
    height: 6em;
    position: relative }
div.container4 p {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) }




/* ~~~~~~~~~ Pulsante cerca blu ~~~~~~~~~ */   

#pulsante {
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: bold 12px Arial, Helvetica, sans-serif;
color: #fff;
padding: 10px 20px;
border: solid 1px #0076a3;
background: #0095cd;



background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
background: -webkit-linear-gradient(top, #00adee, #0078a5);
background: -moz-linear-gradient(top, #00adee, #0078a5);
background: -ms-linear-gradient(top, #00adee, #0078a5);
background: -o-linear-gradient(top, #00adee, #0078a5);


-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;


-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

#pulsante:hover {
background: #0095cd;
background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
background: -webkit-linear-gradient(top, #0078a5, #00adee);
background: -moz-linear-gradient(top, #0078a5, #00adee);
background: -ms-linear-gradient(top, #0078a5, #00adee);
background: -o-linear-gradient(top, #0078a5, #00adee);
background: linear-gradient(top, #0078a5, #00adee);
}


#pulsante:hover {
background: #0078a5;
}


#pulsante:active {
position: relative;
top: 1px;
}

/* ~~~~~~~~~ Pulsante cerca per genere blu ~~~~~~~~~ */   

#pulsante2 {
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: bold 12px Arial, Helvetica, sans-serif;
color: #fff;
padding: 10px 20px;
border: solid 1px #0076a3;
background: #0095cd;



background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
background: -webkit-linear-gradient(top, #00adee, #0078a5);
background: -moz-linear-gradient(top, #00adee, #0078a5);
background: -ms-linear-gradient(top, #00adee, #0078a5);
background: -o-linear-gradient(top, #00adee, #0078a5);


-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;


-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

#pulsante2:hover {
background: #0095cd;
background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
background: -webkit-linear-gradient(top, #0078a5, #00adee);
background: -moz-linear-gradient(top, #0078a5, #00adee);
background: -ms-linear-gradient(top, #0078a5, #00adee);
background: -o-linear-gradient(top, #0078a5, #00adee);
background: linear-gradient(top, #0078a5, #00adee);
}


#pulsante2:hover {
background: #0078a5;
}


#pulsante2:active {
position: relative;
top: 1px;
}


/* ~~~~~~~~~ Rende responsivo ~~~~~~~~~ */   

@media screen and (max-width: 480px) {
/* codice CSS per il dispositivo mobile */
}


/* ~~~~~~~~~ form input in cerca ~~~~~~~~~ */   

input, textarea { /* Stili per il campo di testo e per la textarea */
font-size: 100%; padding:10px 0px;
height: 30px; /* Altezza */
width: 100%;
}

/* ~~~~~~~~~ form option in cerca per genere ~~~~~~~~~ */   

select {
font-size: 100%; padding:10px 10px;
width: 100%; /* Larghezza */
}

**Piermy** · 17-04-2020, 15:17

in particolare alla pagina:
https://www.libriantichicavallero.com/cerca.php
avrei piacere che i check box fossero allineati con il testo (non sono in grado di metterli in una lista così come suggeritomi), e ampliare le due colonne della tabella.

mentre alla pagina:
https://www.libriantichicavallero.co...desiderata.php
non si legge il pulsante cancella

grazie a chi vorrà aiutarmi

Discussione: Aumentare la dimensione dei caratteri in un form "input"

Strumenti discussione

Ricerca discussione

Visualizza

Aumentare la dimensione dei caratteri in un form "input"

Permessi di invio