2012-10-15 9 views
18

Ci scusiamo per questa domanda ma non riesco a trovare una risposta da nessuna parte. Ho codice CSS che dovrebbe impostare l'altezza della mia casella di testo. Sto usando VS2010 Express per Windows Phone, codificando in HTML/CSS/Javascript/C#.Come impostare l'altezza di un campo di input (testo) in CSS?

HTML

<input class="heighttext" type="text" id="name"> 

CSS

.heighttext{ 
    height:30px 
} 

posso impostare l'altezza a tutto ciò che mi piace, ma la casella di testo rimarrà lo stesso! Per favore aiuto, o almeno mandami un link che possa!

+0

sembra un punto e virgola manca nel codice css – Jayy

+4

Bene, [funziona per me] (http://jsfiddle.net/vMwYD/). @ Kaipa: il punto e virgola per la * ultima * regola CSS è facoltativo. –

+0

giusto, capito ora. È opzionale! – Jayy

risposta

26

Prova con padding e line-height -

input[type="text"]{ padding: 20px 10px; line-height: 28px; } 
+0

@Dipkas ha funzionato molto bene per me !, ma posso chiederti perché il padding ha 2 proprietà? e quale dovrei cambiare per ottenerlo un po 'più piccolo? mi hai davvero aiutato! – Arrie

+2

@Arrie Questa è una piccola mano da riempire: 20px 10px 20px 10px;/* in alto a destra in basso a sinistra */e con due valori di riempimento: 20px 10px;/* top-bottom left-right */... spero che questo sia chiaro :) – Dipak

0

È possibile utilizzare questo codice di stile

.heighttext{ 
float:right; 
height:30px; 
width:70px; 
} 
2

controlli Form sono notoriamente difficili da stile cross-platform/browser. Alcuni browser onoreranno una regola CSS height, altri no.

Si può provare line-height (potrebbe essere necessario display:block; o display:inline-block;) o top e bottom padding anche. Se nessuno di quelli di lavoro, che è praticamente esso - utilizzare un grafico, posizionare il input nel centro e impostare border:none; quindi sembra come il controllo di modulo è grande, ma in realtà non è ...