WordPress的侧边栏响应宽度

我已经创建了一个WordPress的主题与“响应”侧栏。我已经将它们设置为20％宽度 - 这很好。不过，我的左边栏中有一个Facebook Widget，根据屏幕宽度/大小不会“调整大小”。WordPress的侧边栏响应宽度

我已经试过低于我的CSS，有没有效果：对小/窄的屏幕尺寸

.fb_iframe_widget iframe { 
    position: relative; 
    max-width: 100%; 
    min-width: 100%; 
}

的Facebook构件仍然是“重叠”。

来源

2016-08-16 user2502658

我建议建立一个小练习区域，而不是下次链接到您的网站。溢出会起作用，但你不会用一个创可贴来学习。 https://jsfiddle.net/xp5knxce/我会从这样的事情开始。此外，这与WordPress或PHP没有多大关系。祝你好运！ – sheriffderek

要溢出到中间主体内容停止iframe中，你可以申请一个溢出：隐藏到父div

.art-blockcontent { 
    overflow: hidden; 
    padding: 7px; 
    margin: 0 auto; 
    color: #000000; 
    font-size: 12px; 
    font-family: "Myriad Pro", "Gill Sans", "Gill Sans MT", Calibri, sans-serif; 
}

iframe不会奇迹般地挤压自己以适应锡y空间（例如右栏中的拉伸图像），并且可能处于最小可行高度/宽度以实际用于任何目的。

我注意到你的导航菜单也在较小的屏幕尺寸下被打破，也许你最好改变整体断点并让你的网站更早地进入一个列的布局。

来源

2016-08-16 20:44:20

非常感谢 - iFrame现在正在调整完美。是的，我在这个噩梦中一次只处理一个问题。对于菜单，请您指点一下我的方向，即您更快地转到一个列布局的意思吗？ – user2502658

通常我会说编辑你的CSS和改变你的媒体查询中的断点，但它看起来像你的主题是使用jQuery将类'响应'应用于HTML元素。看一下script.responsive.js和你的script.js文件，看看它是如何完成的。 –

你在身边的iframe跨度错宽度，试试这个：

<span style="vertical-align: bottom;width: 100%;height: 230px;">

和

.fb_iframe_widget iframe { 
    position: relative; 
    max-width: 100%; 
}

来源

2016-08-16 20:30:15 Provie9

当您调整浏览器窗口的实时大小或在不同设备上查看页面时，是否发生这种情况？

取决于您使用的是哪个小部件，我相信官方Facebook小部件具有响应式设置，您可以在构建时选择它。我注意到，当您以不同的屏幕尺寸重新加载页面时，小部件本身只有响应。实时调整浏览器窗口大小不会影响小部件的尺寸。它使用JavaScript来正确呈现小部件，但仅在页面加载时显示。

来源

2016-08-16 22:09:16 dillonlara115

WordPress的侧边栏响应宽度

回答

相关问题