input上下居中問題

2022-01-28 19:38:43 字數 489 閱讀 4797

ie:不管該行有沒有文字,游標高度與font-size一致。

ff:該行有文字時,游標高度與font-size一致。該行無文字時,游標高度與input的height一致。

chrome:該行無文字時,游標高度與line-height一致;該行有文字時,游標高度從input頂部到文字底部(這兩種情況都是在有設定line-height的時候),如果沒有line-height,則是與font-size一致。

故而,在設定input高度的時候,盡量用padding使其上下居中,可以避免相容性問題,

input,textarea

注意:input是屬於inline-block的標籤,所以有高度,高度要和font-size的值一致;不用給line-height;

line-height的相容問題不太好解決,容器高度越小,顯示效果的差距越明顯。稍微大一點的高度,最好把line-height設定為高度+1px,兩個平台顯示都還不錯。

css居中 水平居中,垂直居中,上下左右居中

網頁布局居中必不可少,其中包括水平居中,垂直居中,上下左右居中,下面一一詳述。div class container div class item 居中 div div 1.text align center 對父元素設定text align center 子元素即可居中。但子元素是有限制的,只對,...

css div上下左右居中

通常我們用到的css布局都是左右居中,經典css寫法如下 body div 上面是經典的左右居中的css寫法,那麼像登入框那些比較小得div塊只是左右居中是否不是太美觀,如果上下左右都居中這是 body div上面的margin可以合併 margin 250px 0 0 250px 大概原理就是 布...

div 中內容上下居中

情形一 div限高,內容長度限一行 v align style html v align 我的內容只能有一行。div 情形二 div限高,內容不限 v mult v mult empty,v mult text v mult empty html v mult empty span text 我的內...