有人會知道爲什麼這些元素出現在移動網站？

Question

我試圖找到一種方法擺脫我的頁面https://newsotuniverse.blogspot.ca/的移動版本中的兩個元素無濟於事。無論我做什麼，「通訊」和「Threetabs」這兩個元素都會繼續出現在我的移動網站上。任何人有任何想法，我可以擺脫他們（在移動網站上），同時讓他們出現在桌面上？
只需將代碼的小片段（以我的網頁上全一目瞭然通過檢查元素）：

<form action='https://feedburner.google.com/fb/a/mailverify?uri=NewsOfTheUniverse&amp;loc=en_US' class='sub-dd' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=NewsOfTheUniverse&amp;loc=en_US, &apos;popupwindow&apos;, scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> 
<h5><b>Subscribe</b> <i>to</i> Newsletter </h5> 
<input class='lite' name='email' placeholder='Enter your Email' type='text'/> <input name='uri' type='hidden' value='News of the Universe'/><input name='loc' type='hidden' value='en_US'/> 
<input class='buter' type='submit' value='Submit'/> </form> 

<div class='threetabs' > 
<ul class='tabber wrap-tabs'> 
<li class='keez'><a href='#id2'>Popular Posts</a></li> 
<li class='keez'><a href='#id3'>Comments</a></li> 
<li class='keez'><a href='#id4'>Category</a></li> 
</ul> 
<div class='clear'/> 

這裏的CSS：

.ct-wrapper {background:#fff; padding:0px 0px; position:relative; margin: 0px;} 
.outer-wrapper {background-image: url("https://cdn.spacetelescope.org/archives/images/screen/potw1209a.jpg"); position: relative; padding:0px 0 } 
.header-wrapper {display: inline-block; float: left; padding: 0; width: 100%; -moz-box-sizing: -webkit-border-box; box-sizing: border-box; } 
.main-wrapper {background:#fff; width:75%; float:left;} 
#content { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; position: relative;} 
.main-inner-wrap {padding:0 16px; margin: 0px; border-right:1px solid #eee; border-left:1px solid #eee; background:$(post.background.color); float:right; position: relative; width:76.2%;} 
.sidebar-wrapper { background:#fff; width:325px; float: right;} 



.leftbar-wrapper{width:160px; float: left;} 
.container {margin: 0 auto; margin-top: 100px padding: 0 15px; position: relative; max-width: 1300px; display:flex;} 
.containerr {margin: 0 auto; margin-top: 100px padding: 0 15px; position: relative; max-width: 1300px;} 

body#layout #top-nav { margin-top: 40px; } 
body#layout #header, body#layout .header-right { width: 46%; } 
body#layout .main-wrapper {width:69%; } 
body#layout .main-inner-wrap {width:64%; } 
body#layout .sidebar-wrapper {width:30%; } 
body#layout .widget-content { margin: 0; } 
body#layout .footer {width:30%;} 
body#layout .outer-wrapper, body#layout .main-inner-wrap, body#layout .sidebar-wrapper, body#layout .ct-wrapper { margin: 0; padding: 0; } 
.ct-wrapper, .crosscol, .post, .sidebar-wrapper, .buzed{overflow:hidden;} 

而這裏的移動代碼：

@media screen and (-webkit-min-device-pixel-ratio:0) { 

#peekar button {padding:5px 9px;} 
.post-meat :after {right: -7px;} 

} 


@media (max-width: 1180px) { 
.ct-wrapper{margin:0 auto;} 
#header {width: 25%;} 
.main-wrapper{width:71.3%;} 
.main-inner-wrap{width:73%;} 
.doze li:first-child{width:46%;} 
.ganed li{width:31.2%;} 
blockquote:before{margin: 2% 14px 0 0;} 
.bukshan{width:34%;} 
.btf-thumb li{width:24% !important;} 
.footer{width:31.2%;} 
.post-title{font-size:22px} 
#related-article ul li{width:31.9%;} 
#related-article img {height: 120px;} 

} 

@media (max-width: 1040px) { 
.main-wrapper {width: 69.4%;} 
.main-inner-wrap {width: 71.8%; border:0;} 
.doze li:first-child{width:44%;} 
.ganed li {width: 30.8%;} 
.bukshan{width:38%; margin-right:12px;} 
#related-article ul li{width:31.6%;} 

} 


@media (max-width: 1000px) { 

#header {width: 30%;} 
.menu li a{padding:13px 13px;} 
.main-wrapper {width:100%} 
.main-inner-wrap {width: 79.9%; padding:25px 0px 0 14px;} 
.sidebar-wrapper{float:left;} 
.bukshan{width:34%;} 
.doze li:first-child{width:46%;} 
.doze li{width:47.4%;} 
.ganed li {width: 31.6%;} 
#related-article ul li{width:32.2%;} 
.footer{width:31%;} 
.footer-credits .attribution{text-align:center;} 
.deen{float:none;} 

} 

@media (max-width: 970px) { 
.btf-thumb li{width:23.4% !important;} 
#related-article ul li{width:32%;} 

} 


@media (max-width: 800px) { 

.menu, .Pagemenu {display: none;} 
.resp-desk,.resp-desk1 {display: block; margin-top:0px;} 
.mainWrap {width: 768px;} 
#navigation.fixed-nav{position:unset;} 
nav {margin: 0; background: none;} 
.main-nav{background:none; border-bottom:none;} 
.Pagemenu li a, .Pagemenu li a:hover, .Pagemenu li a.home{background:rgb(42,46,49); color:#fff; border:0; margin:0;} 
.menu {width:100%; text-align:center;} 
.menu li, .Pagemenu li{display: block; margin: 0;} 
.menu ul li a{margin-left:25px; border:0; color:#909090;} 
.menu li a{border:0; color: #909090;} 
.menu li a:hover,.menu li:hover>a, .menu ul li a, .menu ul li a:hover,.menu ul li:hover>a {background:rgb(54, 59, 63); color: #909090;} 
.menu ul {visibility: hidden; border-bottom:0; opacity: 0; top: 0; left: 0; padding:0; width: 100%; background:none; transform: initial;} 
.menu li:hover>ul {visibility: visible; opacity: 1; position: relative; transform: initial;} 
.menu ul ul {left: 0; transform: initial;} 
.menu li>ul ul:hover {transform: initial;} 
.with-ul::after{top:auto; margin:7px 0 0 6px; border-color: #909090 transparent transparent;} 
.menu ul::after, .menu ul ul::after{border:0;} 
.btf-thumb{display:none;} 
.boped{float:none;} 
#peekar{} 
.social-ico{margin-top:-42px;} 

} 


@media (max-width: 800px) { 

#header {width: 45%;} 
.header-right {display:block; } 
.ct-wrapper{ padding:0 0px;} 
.main-wrapper {} 
.main-inner-wrap {width: 75.4%;} 
.doze li:first-child{width:44%;} 
.ganed li {width: 31%;} 
#related-article ul li {width: 31.8%;} 
.bukshan{width: 32%;} 
.footer{width:30.6%;} 

} 

@media (max-width: 700px) { 

#header{width: 70%;} 
.header-right{display:none;} 
.sidebar-wrapper{} 
.main-wrapper {width: 100%;} 
.main-inner-wrap{padding:25px 0 0; width:100%;} 
.bukshan{width: 38%;} 
.footer{width:46.4%;} 
#bont{width:20%;} 
.fence{display:none;} 
.doze li:first-child{width:45%;} 
.doze li{width:47%;} 
#related-article ul li{width:31.9%;} 

} 

@media (max-width: 600px) { 

} 

@media (max-width: 500px) { 

.bukshan {width: 34%; height:100px; margin-right:12px;} 
.doze li:first-child{width:100%; padding:0; background:none;} 
.doze li{width:100%;} 
.doze li:first-child .inner-content h2 a{color:#444;} 
.doze li:first-child .inner-content h2 a:hover{color:$(link.color);} 
.sit{display:none;} 
.footer {width: 96%;} 
.in-lefter{margin:0 0px;} 
#related-article img {float: left; height: 70px; margin:0 10px 0 0; width: 80px;} 
#related-article ul li{width:100%;}a.related-title{text-align:left;} 
.ganed li {margin: 0 8px 12px 0; width: 48%;} 

} 


@media (max-width: 400px) { 

#header{width: 90%;} 
.container{padding:0 8px;} 
.bukshan {width:38%} 
#peekar input{} 
#carousel ul li{width:310px !important;} 
.footer {width: 94%;} 
.ganed li {margin: 0 0px 12px; width: 100%;} 
span.categi{display:none;} 

} 

@media (max-width: 300px) { 
#header img{width:100%;} 
.sidebar-wrapper{} 
.lefter{margin-left:0; margin-right:0;} 
#peekar input{width:95px;} 

} 

@media (max-width: 260px) { 
.container{padding:0 3px;} 
.sidebar-wrapper{width:240px;} 
#peekar{display:none;} 
#carousel ul li{width:240px !important;} 
.bukshan{width:100%; margin-bottom:5px;} 

Answer 1

只要這樣做：

@media (max-width: 500px) { 
/* .threetabs, .newsletter{ 
display:none; // or opacity 0, but then the space will still be taken 
}*/ 
.sidebar-wrapper { display: none !important;} 

@media (min-width: 500px) { 
.sidebar-wrapper { 
display:block; // or opacity 1 
} 

你也可以在JS中設置它，但是這樣做。