html - 防止在特定断点后重置样式

Question

将页面转换为响应式布局时，CSS 样式在 620px 断点后重置。受影响的设计部分如下。请注意以下代码片段运行良好，仅用于描述我正在做的事情。只有结合完整代码才会出现问题。

.tfulltiny{
	float: left;
	width: 100%;
	padding: 20px 0 20px 0;
}
.tblocktiny{
	float: left;
	text-align: left;
	margin-top: 10px;
}
.tcelltiny{
	float: left;
	text-align: left;
	color: #609;
	font-weight: bold;
}

@media only screen and (min-width: 680px) {
	body {
        margin:0 40px 0 40px;
    }
    .tblocktiny{
	    width: 16%;
	}
	.tcelltiny {
	    width:100%;
	}
}
@media only screen and (max-width: 680px) {
	.tblocktiny{
	    width: 99%;
	}
	.tcelltiny {
	    width:100%;
	}
}

    <div class="tfulltiny">
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Planet</span>
			</div>
		</div>
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Longitude (Deg:Min:Sec)</span>
			</div>
		</div>
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Rasi</span>
			</div>
		</div>
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Longitude (Deg:Min:Sec)</span>
			</div>
		</div>
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Star</span>
			</div>
		</div>
		<div class="tblocktiny">
			<div class="tcelltiny">
				<span>Pada</span>
			</div>
		</div>
</div>

680 像素屏幕尺寸后的预期输出:

但是在超过 620px+ 时样式突然消失了

完整的代码太大了，所以我不能把它放在这里，可能是那个代码中有错误。但是，我想要有关使样式消失的原因的信息。有哪些可能的问题以及如何解决？

编辑:经过搜索，我发现 620px 宽度在代码中使用了 2 次。不知道它在这个错误中有什么作用。

@media only screen and (min-width: 620px) {
      .tblocksml{
            width: 49%;
      }
      .tcellsml {
            width:99%;
      }
}
@media only screen and (max-width: 620px) {
      .tblocksml{
            width: 99%;
      }
      .tcellsml {
            width:99%;
      }
}

Answer 1

试试这个 https://jsfiddle.net/2Lzo9vfc/118/

CSS

     @media only screen and (max-width: 680px) {
        .tblocktiny{
           width: 99%;
           margin-top: 0;
        }
          .tcelltiny {
            width:100%;
            color: black;
            font-weight: normal;

          }
      }

其他解决方案https://jsfiddle.net/2Lzo9vfc/119/

    @media only screen and (min-width: 680px) {
      body {
        margin:0 40px 0 40px;
      }

      .tblocktiny{
        width: 16%;
         margin-top: 10px;
      }
      .tcelltiny {
         width:100%;
         color: #609;
         font-weight: bold;
      }
  }