Sidebar Width

Homepage Forums Nuria Sidebar Width

Tagged: 

This topic contains 8 replies, has 3 voices, and was last updated by  anxgg 1 year ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #26169

    packandhustle
    Participant

    Is there any way that I can change the width of the sidebar and the main content area? I wanted to decrease the sidebar and increase the main area to maximize space.

    #26185

    anxgg
    Moderator

    It can be achieved by adding additional CSS in customizer, go to “Customizer” then go to “Additional CSS” section, then use this code:

    
    @media screen and (min-width: 56.875em)
    	.content-area {
    		flex: 1 0 70%;
    		max-width: none;
    	}
    
    	.sidebar {
    		flex: 0 0 30%;
    	}
    }
    
    

    in the code the 70% is the width of the content area and 30% is the width of sidebar, change those percentage number to achieve the width you think fit. It should work, but if not then let me know.

    • This reply was modified 1 year ago by  anxgg.
    #26192

    packandhustle
    Participant

    Hi anxgg,

    There’s an error that says “Expected LBRACE at line 21, col 2.

    #26193

    packandhustle
    Participant

    Hi anxgg,

    I did it 😀 Thanks a lot.

    #26463

    Himanshi
    Participant

    Hi packandhustle,

    I wanted to do the same but I’m getting the “Expected LBRACE at line 21, col 2.” error as well.
    How did you fix it?

    #26464

    packandhustle
    Participant

    Hi Himanshi,

    I actually ended up reverting to the original width because decreasing the size of the sidebar made my site look ugly. In case you want to try, just copy angxx’s additional css above.

    If you want to expand the content area, I suggest to just decrease the padding of the content area.

    #26472

    anxgg
    Moderator

    Im sorry there’s some error in the code, we lose some bracket there, here the fixed code:

    
    @media screen and (min-width: 56.875em) {
    	.content-area {
    		flex: 1 0 70%;
    		max-width: none;
    	}
    
    	.sidebar {
    		flex: 0 0 30%;
    	}
    }
    
    

    Yes the font size is large, so it might be too narrow for something like 25% width, just try change the width until you think it is good.

    • This reply was modified 1 year ago by  anxgg.
    #26476

    Himanshi
    Participant

    Thank you guys for your quick inputs.

    anxgg, your code worked perfectly well. I’ll experiment with it along with the content area padding, to make my site look right.

    Thanks again 🙂

    #26477

    anxgg
    Moderator

    You’re welcome!

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

Scroll to top

Free Download

Enter your email address below to get access to this free WordPress theme. We will never spam you!

Error: Please enter a valid email address

Error: Invalid email

Error: Please enter your first name

Error: Please enter your last name

Error: Please enter a username

Error: Please enter a password

Error: Please confirm your password

Error: Password and password confirmation do not match