Bring meine rechte Seitenleiste an den Anfang meiner Seite

Seit ich meinen Blog-Inhalt zentriert habe, ist meine rechte Seitenleiste unter meinen Inhalt gefallen.Bring meine rechte Seitenleiste an den Anfang meiner Seite

Wie kann ich es zurückbringen, so dass es rechts von meiner Seite sitzt? (Zwischen dem rechten Rand und dem Rand der Seite).

Live-Link: https://www.moneynest.co.uk/how-to-choose-a-broker/

Code:

<html> 
<body class="post-template-default single single-post postid-594 single-format-standard logged-in admin-bar no-customize-support nolayout windows chrome override" itemscope itemtype="http://schema.org/WebPage"><div class="site-container"> 
<div class="site-inner">  
    <div class="content"> 
     <div id="container"> 
      <div class="central-container"> 
       <div class="middle-content"> 
       <div class="inner-post-head"> 
       </div> 
        <div class="data-content"> 
    <!--MAIN CONTENT HERE -->   
        </div><!-- End .middle-content --> 
    </div> 
     </div><!-- End #container --> 
    </div><!-- End #content --> 
    <aside class="sidebar sidebar-primary widget-area" role="complementary" aria-label="Primary Sidebar" itemscope itemtype="http://schema.org/WPSideBar" id="genesis-sidebar-primary"><h2 class="genesis-sidebar-title screen-reader-text">Primary Sidebar</h2><section id="text-9" class="widget widget_text"><div class="widget-wrap">   <div class="textwidget"> 
<!--SIDE BAR CONTENT HERE--></div> 
    <!--<div id="popular-articles"> 
    <p class="popular-articles-text">Popular articles</p> 
    </div>--> 
</div> 
</div> 
     </div> 
<section id="text-10" class="widget widget_text"><div class="widget-wrap" 
     </div></section> 
     </div> 
     </aside> 
<!--END OF SIDEBAR--!> 
<!--FOOTER STUFF--> 
     </body> 
</html>

Wordpress Laufen mit benutzerdefinierten Genesis Thema und Bootstrap.

Quelle

2017-01-28 Sam Jefferies

Ihr Stylesheet unter Code mit

.site-inner, .wrap { 
    max-width: 1200px; 
}

Wie Sie Ihre Inhalte mit margin-left zentriert haben, diese 1200px ist nicht genug, um die Sidebar zu halten. SO bitte, dass auf unter ein ändern, so dass es 2 für Sie

.site-inner, .wrap { 
    max-width: 100%; 
}

Methode funktioniert: Machen Sie Ihre Inhalte teilweise durch aus zentralisiert und Sidebar rechten Seite positioniert machen. Style wie folgt:

.site-inner{ 
position: relative; 
} 
.content { 
width: 792px; 
margin: 0 auto !important; 
float: none; 
} 
.sidebar-primary { 
    position: absolute; 
    width: 240px !important; 
    right: 0px; 
    top: 0px; 
}

Quelle

2017-01-28 10:59:31

Danke, ich habe Methode 1 & 2 angewendet, die abgesehen von einer großen Polsterung zwischen dem Inhalt und der Seitenleiste groß funktionierte. Wie kann ich das entfernen? –

Anstatt im Grunde zu entfernen, was ich sage ist, wie kann ich die Sidebar in der rechten Seite zentrieren? –

Dafür denke ich, dass Sie das Website-Layout in drei als linke Seitenleiste Inhalt und dann rechte Seitenleiste teilen müssen. Wenn Sie die linke Seitenleiste leer lassen, können Sie das gleiche Layout mit der richtigen Füllung zwischen dem Inhaltsteil und der rechten Seitenleiste haben. Machen Sie Ihre linke Seitenleiste, um die gleiche Höhe des Inhalts div zu haben, damit der leere Teil sich durch die Seite erstreckt. –

position: fixed; 
right: 0; 
top: 0;

oder stattdessen es dünner machen (Breite: 80%) und gibt den Inhalt display: inline

Quelle

2017-01-28 10:46:30 Omnitored

Neben den linken Rand von .content entfernen, würde ich empfehlen, auch Polsterung aus .Site entfernen -inner und Hinzufügen margin:0 auto;.

Quelle

2017-01-28 10:50:39

Ich habe in Ihrer Seite getestet und dies getan. Es funktioniert. Verringern Sie einfach Ihre Margin-Left-Eigenschaft in relativen Medienabfragen.

@media only screen and (min-width: 1200px) 
(index):27 
.content { 
    margin-left: 10%; 
}

Quelle

2017-01-28 10:51:19 Incarnate

Bring meine rechte Seitenleiste an den Anfang meiner Seite

Antwort

Verwandte Themen