Tôi có một câu hỏi rất cơ bản. Tôi đang thiết lập chiều cao đến 50px cho nút gửi biểu mẫu html của tôi. Nó hoạt động trên Firefox chứ không phải Chrome và Safari. Mã đơn giản như sau:Nút đầu vào HTML css-height không hoạt động trên Safari và Chrome
<input type="submit" value="Send" style="height:50px;" />
Bất kỳ ý tưởng nào về cách làm cho mã hoạt động trên Chrome và Safari?
Thay đổi nó <input>-<button> và thêm -webkit-appearance: none; khi bắt đầu CSS của bạn, ví dụ:
.submitbtn {
-webkit-appearance: none;
height: 50px;
background-color:#FFF;
color:#666;
font-weight:bold;
border: solid #666 1px;
font-size: 14px;
}
Tôi đã làm và nó hoạt động tuyệt vời. Cảm ơn nhiều. – Madeline
+1 từ tôi! Điều này giải quyết vấn đề về kiểu dáng của tôi để xem trang web của tôi trên iPhone. Cảm ơn!! –
Thực ra ... Tôi đã sửa chữa. Vấn đề của tôi đã được cố định bằng cách tăng kích thước phông chữ, thay đổi nó thành một nút '' không giải quyết nó cho tôi. Giống như OP nó hoạt động tốt trong Firefox nhưng không thay đổi trong Safari, điều quan trọng đối với tôi khi tôi muốn nó hoạt động trên iPhone. –
này nên được làm việc cũng có.
-webkit-appearance:default-button;
Có một vài thông số cho thuộc tính này mà bạn có thể muốn tận dụng và/hoặc xem. Ngoài ra, nếu bạn chỉ muốn vô hiệu hóa các bóng bên trong của các trường đầu vào, bạn có thể sử dụng -webkit-appearance: caret ;.
button
button-bevel
caret
checkbox
default-button
listbox
listitem
media-fullscreen-button
media-mute-button
media-play-button
media-seek-back-button
media-seek-forward-button
media-slider
media-sliderthumb
menulist
menulist-button
menulist-text
menulist-textfield
none
push-button
radio
searchfield
searchfield-cancel-button
searchfield-decoration
searchfield-results-button
searchfield-results-decoration
slider-horizontal
slider-vertical
sliderthumb-horizontal
sliderthumb-vertical
square-button
textarea
textfield
Tất cả các giá trị đó có liên quan đến câu hỏi cụ thể này không? Có thể bạn có thể thu hẹp nó xuống một vài trong số những người có liên quan nhất? –
Đó là những vars có thể cho những gì tôi nói -webkit-xuất hiện: nút; ví dụ như. –
Chỉ cần thêm -webkit-appearance: none; trên <input> tôi làm việc cho tôi trên trình duyệt Safari trên Macbook.
Thêm vào Şήøωў 's (upvoted)answer:
@ Safari 11.0.2 (13604.4.7.1.3) @ MacOS 10.13.2 (17C88)
ví dụ
input[type=button]{
-webkit-appearance: button;
}
giải quyết vấn đề của tôi (chỉ -size chủ yếu là [-webkit-] font- * có tác dụng rất hạn chế);
trọng "User Agent kiểu":
input:matches([type="button"], [type="submit"], [type="reset"]){
-webkit-appearance: push-button;
}
Tôi không chắc chắn lý do tại sao điều này không làm việc một mình, nhưng tôi biết nếu bạn thêm một màu nền nó sẽ đọc 'thuộc tính height' của bạn: '' – tcd
Nó hoạt động trong Safari 5 và Chrome 20 khi không có CSS khác tham gia. Vui lòng xem xét chỉnh sửa câu hỏi của bạn để bao gồm CSS của bạn. – Jay
cũng nó làm việc cho tôi có lẽ bạn có nhiều css mà bạn không cho chúng ta thấy? – Linas