1
私が作ったかなり簡単なテーブルのコードは次のとおりです。問題は、テーブルの1行目と2行目の下部に白い余白があることです。何故ですか。私は複数のソリューションを試してきましたが、何も機能していませんHTMLテーブルの行間の間隔
body, html {
height: 100%;
}
body {
background-color: #a00000;
margin: 0; /* remove default margins added by browsers */
}
.wrapper {
display: flex;
height: 100%;
}
table {
margin: auto;
background-color: #fff;
}
img {
max-width: 120px;
max-height: 120px;
border: solid 5px #a00000;
background-color: #a00000;
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Bobcat Menu</title>
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="wrapper">
<table align="center" cellspacing="0" border-spacing="0">
<tr>
<td>
<a href="mobincube://action/section/DropDay">
<img src="
https://s3-us-west-2.amazonaws.com/s.cdpn.io/837604/D.png" />
</a>
</td>
<td>
<a href="mobincube://action/section/Schedule">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/837604/S.png" />
</a>
</td>
</tr>
<tr>
<td>
<a href="mobincube://action/section/Calculators">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/837604/C.png" />
</a>
</td>
<td>
<a href="mobincube://action/section/News">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/837604/N.png" />
</a>
</td>
</tr>
</table>
</div>
</body>
</html>
レイアウト用のテーブルを使用しないでください。 CSSは20年前になりました。 – Quentin
@QuentinあなたはOPのようにテーブルをスタイルするためにCSSを使用していないと言います。 –
@JonUleis - 私は彼らがレイアウトのためにテーブルを使用しているように言っています。 – Quentin