The problem of centering the text in the input box

Code first:

<input type="text" placeholder=""/>
input{
                font-size: 25px;
                font-weight: 600;
                color: -sharp666666;
                height: 30px;
                line-height: 30px;
            }
            input::-webkit-input-placeholder{
                color: -sharp999;
                font-size: 12px;
                line-height: 20px;
                padding-bottom: 10px;
            }

effect is shown in figure

clipboard.png
I believe you already know what I mean-how to center the placeholder= "test" text vertically? I tried every method I could think of, but it didn"t work. I finally gave up and wrote a pseudo input box

.
Mar.02,2021

remove the line-height attribute from input::-webkit-input-placeholder

< H2 > add < / H2 >

it seems impossible to try it in person. If you try it in another way, you can use positoon

.
input::-webkit-input-placeholder{
  position:relative;
  top:xx px;
}

just let the height in the Input box be the same as the row height

input{
height: 30px;
line-height: 30px;
}


< html >

< head >

<meta charset="utf-8">
<title></title>

< / head >
< style >

input {
    width: 200px;
    height: 30px;
    font: 14px/1 "microsoft yahei";
    color: -sharp333;
}

input::-ms-input-placeholder {
    text-align: center;
}

input::-webkit-input-placeholder {
    text-align: center;
}

< / style >

< body >

<input placeholder="" /> </body>

< / html >

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eadca7-2180.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eadca7-2180.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?