css - 入力タグのサイズが大きくなり、入力タグ内のテキストが垂直方向に中央揃えになりました

Question

これは私がする必要があるフォームです:

今のところ、私はこの時点にいます：

ご覧のとおり、入力ボタンを大きくする必要があります。そうしないと、視覚的に機能しません。私の質問は、入力ボタンを垂直方向に大きくし、入力テキストをボックスの中央で垂直方向に中央に配置する方法です。

CSS ソリューションが最適です。

これが役立つ場合、これは私のhtmlコードです:

<form name="bookingform" action="form-to-email.php" method="post">
                            <div id="form_box" class="gradient">
                                <div id="center_box">
                                    <h3>WANT TO BOOK ME?</h3>
                                    <div id="form_data">
                                        <br>
                                        <table>
                                            <tr>
                                                <td><input type="text" value="Company name" name="company" /></td>
                                                <td class="tdright"><input type="text" value="Name" name="name" /></td>
                                            </tr>
                                            <tr>
                                                <td><input type="text" value="Telephone" name="telephone" /></td>
                                                <td class="tdright"><input type="text" value="Email" name="email" /></td>
                                            </tr>
                                            <tr>
                                                <td><input type="text" value="Booking date" name="date" /></td>
                                                <td><input type="button" /></td>
                                            </tr>
                                        </table>
                                    </div>  
                                    <div id="form_text">
                                        <br>
                                        <textarea rows="10" cols="40" name="message">Your text...</textarea>
                                        <input type="submit" value="SEND" name="submit" />
                                    </div>
                                    <input type="image" src="" name="Send" />
                                </div>
                            </div>
                        </form>

Answer 1

input[type=button] {
    height: 35px;      /* increase the height */
    line-height: 35px; /* vertically align the text */
}

デモ