[مشروع] اكرر اضافة اي خطوة لكي ترسخ في ذهني css and media screen

PHP كود :
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@media screen and (min-width: 258px)
{
#sorry{
display:none;
}
}
 /*@media screen and (max-width: 600px) {
#mycontainer *{
display:block;
}
}*/
 @media screen and (max-width: 257px) {
sorry{
display:block;
}
#mycontainer {display:none;}
table{display:none;}
}
table {
border:1px solid black;
width: 95%;
height: 250px;
}
#mycontainer *{
display:inline;
}
.td{
vertical-align: top;
padding:5px;
}
</style>
<title>
Soso
</title>
</head>
<body>
<center>
<table>
<tr>
<td class="td" bgcolor="blue">
<div id="mycontainer">
<div><input type="text" id="txtusername" /></div>
<div><input type="text" id="txtpassword" /> </div>
<div><input type="button" id="ok" value="OK" /> </div>
</div>
</td>
</tr>
</table>
<br>
<div id="sorry">
<h1>معذرة لكن مقاس شاشة جهازك تبدو وكانها صغيرة جدا!</h1>
<img src="sad.png" width="100px" />
</div>
<br>
</center>
</body>
</html>