以下のコードについてお聞きしたいことがあります。
<div class="main_box"> <h3>〇〇〇動物病院 | ネット予約</h3> <div> <form method="post" action="#"> <table class="login_table"> <tr> <th>飼い主様ID</th> <td><input type="text" name="owner_id"></td> </tr> <tr> <th>パスワード</th> <td><input type="text" name="password"></td> </tr> </table> <div class="save_info_box"><input type="checkbox" name="save_login_info">ログイン情報を保存</div> <div class="login_submit_box"><input type="submit" value="ログイン"></div> </form> </div> </div>
.main_box{ width:350px; margin-left:651px; } .login_table{ border-collapse: collapse; border: solid 1px orange; width:350px; } .login_table th, .login_table td{ border: solid 1px orange; } .login_table td{ width:193px; } .save_info_box{ text-align: center; margin: 15px; } .login_submit_box{ width:276px; text-align:center; } .login_submit_box input[type="submit"]{ background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f3f3f3), color-stop(0.5, #e2e2e2), to(#d1d1d1)); text-shadow:0 1px 0 silver; border:1px solid silver; width:100px; height:30px; border-radius:3px; } .login_submit_box input[type="submit"]:hover{ background:none; background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#b8b5b5), color-stop(0.5, #c4c1c1), to(#aaa7a7)); } .login_table td input[type="text"]{ border:1px solid #444; padding: 5px 5px; width: 180px; } .login_table th{ background:#fce5bc; } body{ margin:0; } p{ margin:0; }
こちらのコードなのですが、tableタグにmargin-rightをつけ、全体的に左に寄せたいのですが、全く左に寄せることができません。しかし、デベロッパーツールで確認しますと、margin-rightをつけた分だけmarginをつけたことを示すオレンジ色のマークがついています。何故要素自体は左に寄っていないにも関わらず、marginがついたマークはついているのでしょうか。。。?

回答3件
あなたの回答
tips
プレビュー