Văn bản không bắt đầu từ đầu trái của trường văn bản nhập

Question

Tôi có trường nhập với chiều cao cố định. Văn bản được căn giữa theo chiều dọc, nhưng tôi muốn nó ở trên cùng bên trái của đầu vào.

CSS

.wideInput{ 
    text-align: left; 
    padding: 0.4em; 
    width: 400px; 
    height: 200px; 
} 

HTML

<input class="longInput" value="<?php echo $row['foodPrice']; ?>" /> 

Dưới đây là một jsFiddle đó chứng tỏ vấn đề>http://jsfiddle.net/9cR5j/

Answer 1

nếu những gì mà hơn loại bỏ padding: 0.4em; và thiết lập

padding-left:0; 
padding-top:0; 
padding-bottom:0.4em; 
padding-right: 0.4em; 

Sau khi thực hiện thay đổi thay đổi tên lớp ở đây

<input class="wideInput" value="<?php echo $row['foodPrice']; ?>" /> 

thay vì longInput nó sẽ được wideInput

---

Cập nhật

JsFiddle demo with TextArea

này sẽ làm việc với textarea chỉ vì đầu vào chỉ được phép nhập giá trị trong một dòng tức là không nhập keyallowed hoặc nó doent quấn văn bản dài, nó chỉ cần thêm dữ liệu trong một dòng

Answer 2

đệm của bạn đang gây ra văn bản để bắt đầu 0.4em từ phía bên tay trái. Nếu bạn muốn các văn bản để thực sự gióng bên trái, loại bỏ các padding bên trái:

.wideInput{ 
    text-align: left; 
    padding: 0.4em 0.4em 0.4em 0; 
    width: 400px; 
    height: 200px; 
} 

Answer 3

Thay vì input lý do bạn không thử dùng textarea?

<textarea class="longInput" cols="30" rows="10"></textarea> 

Nó sẽ thêm văn bản từ góc trên cùng bên trái.

Answer 4

Để sắp xếp trái và đầu bạn sẽ phải thiết lập một chiều cao nhỏ hơn và một padding-bottom:

text-align: left; 
padding: 0.4em; 
padding-bottom:190px; 
width: 400px; 
height: 10px; 

Answer 5

Hãy thử thiết lập thuộc tính line-height CSS trên các lĩnh vực input để giống như height của lĩnh vực đó.

height:200px; line-height:200px;