disabling/hiding blog primary sidebar

  • Hi there i’ve got a website using the “Stay” theme which allows for the blog section to have two sidebars on the right side for widgets.
    fig 1

    After having both sidebars i decided that i only wanted one and so i removed all widgets from the the first or “primary” sidebar but the empty space remains.
    fig 2

    Is there any way in css to get the blog element to fill up the gap either by disabling the sidebar element or by getting the blog element to ignore the gap? Setting the sidebar element to ‘display:none’ didn’t seem to work.
    I know its possible because before i decided to use that first sidebar column the website looked like this: fig 3

    Heres the CSS i have so far:

    img.header-image {
    	max-width: 79%;
    	position: relative;
    	top: .6vw;
    	right: .4vw;
    }
    
    a {
    	font-weight: bold;
    }
    
    .flex-control-paging li a {
    	width: 11px;
    	height: 11px;
    	display: block;
    	background: #666;
    	background: rgba(0,0,0,0.1);
    	cursor: pointer;
    	text-indent: -9999px;
    	-webkit-border-radius: 20px;
    	-moz-border-radius: 20px;
    	-o-border-radius: 20px;
    	border-radius: 20px;
    	box-shadow: inset 0 0 3px rgba(246,246,246,0.4);
    }
    
    .flex-control-paging li a.flex-active {
    	background: #000;
    	background: rgba(232,235,228,0.9);
    	cursor: default;
    }
    
    .featured h2 a {
    	color: #481d28;
    	text-decoration: none;
    }
    
    .hentry .wp-post-image, .entry-page-image .wp-post-image {
    	display: none;
    	max-width: 100%;
    	height: auto;
    }
    
    #home-widgets {
    	background-color: #f6f6f6;
    	margin-top: -10px;
    	margin-bottom: 0;
    	margin-right: 0;
    	margin-left: 0;
    	padding: 10px 0 0;
    	overflow: visible;
    }
    
    .socialwidgets {
    	padding: 0;
    	overflow: visible;
    }
    
    img.buttonimage {
    	padding: 5px;
    }
    
    img.buttonimage:hover {
    	background: rgba(86,100,78,0.2);
    	border-radius: 20px;
    }
    
    img#wpstats {
    	display: none;
    }
    
    .filmbuttons {
    	position: relative;
    	display: block;
    	margin: auto;
    	padding: 3% 0 0;
    	width: 100%;
    }
    
    .aloneimight {
    	display: block;
    	margin: auto;
    }
    
    .searchform {
    	display: none;
    }
    
    #secondary {
    	width: 0;
    	display: none;
    }
    
    #tertiary {
    	float: right;
    }
    
    .post {
    
    }

    And my website is: https://littlelampfilms.com/
    Any assistance or insight would be greatly appreciated!
    Sincerely,
    James.Y

    The blog I need help with is: (visible only to logged in users)

  • Hi James, this thread is marked as resolved so I wanted to make sure you were able to get this sorted. Just let us know if you still need any CSS help and we’ll be happy to take a look.

    p.s. love the idea of a travelling documentary bus, what a unique project! I used to work in doc production myself. :)

  • The topic ‘disabling/hiding blog primary sidebar’ is closed to new replies.