WordPress Sidebar goes beneath the post [closed] - php

Question

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
This
is my website I don't know for what reason my sidebar is not showing on the aside and it has gone down. Please anyone help me to fix this issue.
index.php
<?php
/**
* The main template file.
*
* This is the most generic template file in a WordPress theme
* and one of the two required files for a theme (the other being style.css).
* It is used to display a page when nothing more specific matches a query.
* E.g., it puts together the home page when no home.php file exists.
*
* #link https://codex.wordpress.org/Template_Hierarchy
*
* #package Trevelle
*/
get_header(); ?>
<div class="background">
<div class="container padding-top">
<div class="row" id="primary">
<main id="content" class="col-sm-8">
<?php if ( have_posts() ) : ?>
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php
/*
* Include the Post-Format-specific template for the content.
* If you want to override this in a child theme, then include a file
* called content-___.php (where ___ is the Post Format name) and that will be used instead.
*/
get_template_part( 'template-parts/content', get_post_format() );
?>
<?php endwhile; ?>
<?php the_posts_navigation(); ?>
<?php else : ?>
<?php get_template_part( 'template-parts/content', 'none' ); ?>
<?php endif; ?>
</main>
<aside class="col-sm-4 lead text">
<?php get_sidebar(); ?>
</aside>
</div>
</div>
</div>
<?php get_footer(); ?>
and here is CSS because its lengthy http://jsfiddle.net/go75571m/

Answer 1

EDITED, ALL NEW ANSWER:
Your theme's CSS contains one setting that breaks the underlying bootstrap CSS.
Locate the following file and open it:
"/trevelle/wp-content/themes/trevelle/style.css"
On lines #2492 - 2497 of that file you find the following rule:
main {
padding:25px;
margin:10px 5px;
color:black;
line-height:30px;
}
In there, change
margin to 10px 0;
That should do the trick. I don't know if that's a little error in the theme or if the wrong behaviour is also caused by something else, but right now, this will fix it.
Those 5px margin left and right of the main element were just a little bit too much: 66, 6667% width (main) plus 33,3333% width (aside) = 100% PLUS those 10px just won't fit into the surrounding container...