2017-07-09 2 views
0

ich ein Problem mit der Website habe ich gerade für meine Kunst zu machen theyoungillustrations.comSidebar an der falschen Stelle ist, wenn Desktop, aber nicht, wenn das Handy

Ich habe absolut keine Erfahrung in der Programmierung, so wenden Sie sich bitte erklären wie ich bin fünf

Ich bin ein bestehender Code ändern, aber ich erlebe ein Problem mit der Sidebar. Da ich ein Banner (oben) gemacht habe, ist die Sidebar momentan darunter und ich kann nicht herausfinden, wie ich das beheben kann, ohne die Mobile-Sidebar zu ruinieren.

Dies hier scheint das Ziel zu sein, aber der Stilteil ist der, von dem ich mir nicht sicher bin.

<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> 

Dann habe ich dies:

} 
    #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}; 
    } 

Aber ich bin ratlos. Danke fürs Helfen.

Antwort

0

Dies ist, weil Sie einen Haltepunkt für verschiedene Geräte hinzufügen möchten, können Sie Hilfe dieser URL nehmen: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

+0

Konkret, wie kann ich sicherstellen, dass die Seitenleiste nicht auf die gesamte Oberseite der festgelegt ist Seite im Desktop-Interface-Modus, auch wenn ich diese Abfrage hinzugefügt habe? Weil es mir scheint, wenn du das hinzufügst, weiß es immer noch nicht, wo er das Ding hinstellen soll. (Ich hoffe du verstehst was ich sage) – Evy

Verwandte Themen