HTML　CSS 横並びボタンの設置

例えば英語と日本語のサイトあるときなどに
使っていただける、CSSとHTMLだけ
よこ並びのボタンの作りかた備忘録です。

作るのはこんな感じの
シンプルなボタン↓

コードなど記載していきます。

HTML

<table align="right" style="margin-right: 15px"><tr>
<td><a href="#" class="btn2">日本語</a></td>
<td><a href="English.html" class="btn1">English</a></td>
</tr></table>

右のほに寄せる感じで書いてます。
右側のマージンなどは適宜調整してください♪
並べて使いたいのでシンプルにtableで

CSSは

/*ボタン追記部分*/
a.btn2 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 70px;
	margin: auto;
	font-weight: bold;
	border: 2px solid #696969;
	background: #696969;
	color: #fff;
	transition: 0.5s;
}
a.btn1 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 70px;
	margin: auto;
	font-weight: bold;
	border: 2px solid #c0c0c0;
	color: #c0c0c0;
	transition: 0.5s;
}
a.btn1:hover {
	color: #fff;
	background: #808080;
}

となってます。
btn2はアクティブ状態にタイので
ホバーは消しています。

リンク先のページではボタン1、２を
逆にして使ってます。

備忘録兼参考まで。