显示:@media中的任何行为都不代表全球

时间:2019-03-23 21:01:01

标签: html css display

我有2个我不知道的主要问题。

1)我有一个隐藏的小部件区域,仅在最大宽度为1338px时才显示,同时,我的右小部件应该消失。

问题是,当我添加display: none;来隐藏左窗口小部件时,即使最大宽度达到1338px,它也保持隐藏状态。

在我的@media中,将display:block的值设置为max-width: 1338px;

2)我的下一个问题是我的左侧边栏有一个图库,当max-width到达923px

时,该图库应消失

但是,当我将display:none的{​​{1}}添加到@media的{​​{1}}时,无论屏幕的宽度如何,它都不会显示任何内容。即使我的屏幕尺寸超过923像素,它也不会显示任何内容。

这里是指向我正在研究的网站的示例的链接。 https://codepen.io/christiangutierrezreyez/pen/aMXpQd?editors=1100

您可能会发现问题的区域位于CSS的行中 169至192 和351。我注释了第352行,因为该行给我带来了问题。

我很抱歉没有删减这些区域,因此它可能更具可读性。但是我不知道该切掉哪些部分,剩下哪些部分。

任何帮助将不胜感激!我感谢您的宝贵时间。

1 个答案:

答案 0 :(得分:0)

关于左侧面板和画廊,您对媒体查询的结帐}为时过早,并且没有封装#photos-left-sidebar-wrapper, #hidden-left-sidebar

https://codepen.io/anon/pen/KEJWop?editors=1100