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的側邊欄響應寬度

回答

相關問題