使用HTML和CSS在Wordpress中將圖像（不是背景）拉伸到完整的瀏覽器寬度

Question

我正在嘗試將GIF顯示設置為完整的瀏覽器大小，但我希望它在菜單（站點標題div）和頁腳上方。 為了做到這一點，我隱藏了頁面標題div並被困在一個小容器中。 `

<div id="content" class="site-content"><div class="page-header"><div class="container"><h1 class="entry-title">Kampania</h1></div></div><div id="content-inside" class="container no-sidebar"><div id="primary" class="content-area"><main id="main" class="site-main" role="main"><article id="post-1259" class="post-1259 page type-page status-publish hentry"><header class="entry-header"></header><div class="entry-content"><p><img src="https://shop.sin.org.pl/wp-content/uploads/2017/03/gif.gif" id="selector"></p></div></article></main></div></div></div>

在div“content-area”中打包的內容我需要移動到“site-content”div。 我如何實現這一目標？

https://shop.sin.org.pl/pl/kampania/

謝謝！

Answer 1

您是否嘗試將頁面模板設置為100％寬度？

如果這不起作用，你可以手動將頁面設置為100％;

#content-inside {
    width:100%;
    max-width:inherit !important;
    padding:0 !important;
}

Answer 2

嘗試添加此CSS：

#content-inside {
   max-width: 100%!important;
   padding: 0px!important;
}