※ ChatGPTを利用し、要約された質問です(原文:送信ボタンのサイズを変更したいです)
送信ボタンのサイズを変更する方法
このQ&Aのポイント
送信ボタンのサイズを変更する方法について説明します。
ボタンの大きさが横一杯に広がって灰色になってしまう問題を解決する方法を紹介します。
ボタンの縦幅と横幅の大きさを調節しても適応されない場合の対処法について解説します。
入力されたデータを送信するための「送信ボタン」を画像付きのボタンのコードを書いているのですが、付属画像のように、 ボタンの大きさが横一杯に広がって灰色のようになって、しまうのですが、ボタンの大きさの縦幅と横幅の大きさを調節しても、適応されず困っています。 ボタンの画像自体の大きさは適応できています。
困っています。
コードは以下にあります。
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8"/>
<title></title>
<link rel="stylesheet" href="senden.css">
<style type="text/css">
/* 送信ボタンの位置 */
.auto-style3 {
text-align: center;/* 送信ボタンを中央に配置 */
}
/* 送信ボタンの代替画像位置 */
.auto-style4 {
text-align: center;/* 画像を中央に配置 */
margin-top:87px ;/* 画像の上の余白 */
}
/* 画像の大きさ調節 */
img.example8 {
width: 50%;
height: 100px;
</style>
</head>
<body>
<form action="form1.php" method="post">
<div class="enter">
<button type="submit" name ="submit" class="auto-style4" height="70px" width="40px">
<img src="senden15.png" alt="確認画面へ" class="example8"/></button>
</div>
</form>
</body>
</html>