側邊欄是在錯誤的地方，當桌面，而不是在移動

我有一個網站，我目前正在爲我的藝術問題 theyoungillustrations.com側邊欄是在錯誤的地方，當桌面，而不是在移動

我在編碼絕對沒有經驗，所以請解釋像我五個

我正在改變一個令人興奮的代碼，但我遇到了側邊欄的問題。由於我製作了一個標題（位於頂部），側邊欄目前正在其中，我無法瞭解如何在不損壞移動側欄的情況下修復此問題。

這裏看起來是目標，但風格部分是我不確定的部分。

<div id="sidebar" class="{select:Header Text Case} ">   

<div class="inner animated slow"> 
    <div class="wrap"> 

     <nav class="sidebar-navigation cl"> 
      <ul> 

       {block:IfHomeLink} 
        <li><a href="/">Home</a></li> 
       {/block:IfHomeLink} 

       {block:HasPages} 
        {block:Pages} 
        <li> <a href="{URL}">{Label}</a></li> 
        {/block:Pages} 
       {/block:HasPages} 

      </ul> 
     </nav> 

    </div> 
</div> 
</div> 


<div id="header" class="{select:Header Text Case} "> 
<div class="wrap"> 
    <div class="inner"> 

     <div class="logo"> 
      {block:ifnotlogoimage} 
       <a href="/" title="{lang:Home}">{Title}</a> 
      {/block:ifnotlogoimage} 
      {block:iflogoimage} 
       <a href="/"><img src="{image:Logo}" alt="logo" /></a> 
      {/block:iflogoimage} 
     </div>   

     <nav class="navigation cl"> 
      <ul> 
       {block:HasPages} 
        {block:Pages} 
        <li> <a href="{URL}">{Label}</a></li> 
        {/block:Pages} 
       {/block:HasPages} 


       &nbsp; 
      </ul> 
     </nav> 

     </div> 
     </div> 



     <div class="sidebar-toggle"> 
      Menu 
     </div> 

     <div class="close-mobile-modal"> 
      <svg width="16px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
       <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 
        <path d="M7.172,10 L3.642,6.47 L0.102,2.93 L2.928,0.1 L10,7.173 L17.07,0.103 L19.9,2.93 L12.827,10 L19.897,17.07 L17.07,19.9 L10,12.827 L2.93,19.897 L0.1,17.07 L7.173,10 L7.172,10 Z"></path> 
       </g> 
      </svg> 
     </div> 
    </div> 
</div> 
</div>

然後，我有這樣的：

} 
    #sidebar h3 { 
     margin-bottom:20px; 
     color:{color:Header Text}; 
     font-size:13px; 
    } 
    #sidebar-navigation { 
     color:{color:Header Text}; 
     background:{color:Header Background}; 
     font-size:{text:Header Size}; 
    }

但我無言以對。感謝您的幫助。

來源

2017-07-09 Evy

這是因爲你需要添加各種設備斷點，你可以把這個網址的幫助：https://www.w3schools.com/css/css_rwd_mediaqueries.asp

來源

2017-07-09 13:39:22

具體來說，我如何確保側邊欄不固定在的整個頂部在桌面界面模式下，即使我添加了該查詢，頁面？因爲在我看來，如果你補充說，它仍然不知道該把東西放在哪裏。（我希望你明白我在說什麼） – Evy

側邊欄是在錯誤的地方，當桌面，而不是在移動

回答

相關問題