罫線があるtableの中のtableに対して罫線を引きたくない

Question

下記のコードを書いています。この罫線ありのテーブル（クラス名col-head-type1）の中に新たにテーブルを置きたいのですが、このテーブル（クラス名select_menu）には罫線を引きたくないのです。何かいい方法はありませんか？

ちなみに、initial、unsetなどをしてもだめでした。

@charset "utf-8";
/* CSS Document */
.col-head-type1 {
	border-collapse: collapse;
	width: 100%;
}

.col-head-type1 th, .col-head-type1 td {
	border: 1px solid #717171;
	padding: 0px;
	text-align:center;
}

.col-head-type1 th {
	background: #f9fafc;
	text-align: left;
	width: 200px;
}

@media only screen and (max-width: 800px) {
	.col-head-type1 tr, .col-head-type1 th, .col-head-type1 td {
		display: block;
		width: 100%;
	}
	.col-head-type1 tr:first-child {
		border-top: 1px solid #dbe1e8;
	}
	.col-head-type1 th, .col-head-type1 td {
		border-top: none;
	text-align:center;
	}
}

table.select_menu th tr td{
	border:unset;
	border-spacing: 0px;
}

table.select_menu tr.list_mode_1{
	background-color:#FFDBC9;
}
table.select_menu tr.list_mode_2{
	background-color:#CBFFD3;
}


table.select_menu td{
	padding:10px;

}

Answer 1

肝心のテーブル自体の表記がないのでなんとも言えませんが

border:0px solid;

とすれば良いのでは？

ただしテーブルの中にテーブルというのは、表という構造の中に表を置くわけで
マークアップ的にはおかしいと思います。
もしレイアウトのためのテーブル利用でしたらやめたほうがよいでしょう

Comments

[HisashiSakamoto]

回答頂き、ありがとうございます。
表の入れ子が推奨されていないそうなので、入れ子はあきらめようと思います。

Answer 2

今回のパターンは yambejp さんの回答で十分ですが、詳細度を考慮するよりも、入れ子にする可能性があるなら最初から親だけに適用されるように書いておいたほうがいいでしょう。

.col-head-type1 > * > tr > th,
.col-head-type1 > * > tr > td {
    border: 1px solid #717171;
}

Comments

[HisashiSakamoto]

回答頂き、ありがとうございます。
表の入れ子が推奨されていないそうなので、入れ子はあきらめようと思います。

Answer 3

HTMLがないので何とも言えませんが、2つ目のCSSコードブロックの一番上の「セレクタ記述」を以下ではどうですか？

table.select_menu tr,
table.select_menu th,
table.select_menu td {
    border:unset;
    border-spacing: 0px;
}

Comments

[HisashiSakamoto]

回答頂き、ありがとうございます。
表の入れ子が推奨されていないそうなので、入れ子はあきらめようと思います。