CSS – remove sidebar / change column width

  • Author
  • #913179



    Could anyone tell me how to amend the CSS to remove the right-hand sidebar on the Oxygen theme? Or if it’s not possible, how to extend the width of the main column?


    The blog I need help with is tdollshouse.com.



    Due to the responsive nature of the theme it would take quite a bit of CSS modification in order to make sure removing the sidebar doesn’t mess up the entire layout on multiple devices.

    However, if you would like the right sidebar to disappear but leave the left sidebar and main content areas the same size you can just throw an empty text widget into the Secondary Sidebar section in Appearance->Widgets.


    I love what you did with the text in the header image!

    With media queries, it is possible to make changes just for the large screen size if you wanted to do that. Also, if you can stick to percentages, that’s usually pretty safe. I did a little tinkering, and I think this will do the trick and still keeps the responsive things mostly the sameā€”the “Read Article” links don’t appear in small screen sizes anyway so changing the left and right absolute values doesn’t matter in this case.

    Try this as a starting point and see if you like it:

    #tertiary {
    	display: none;
    #content {
    	margin-right: 0;
    .cat-links {
    	right: auto;
    a.read-more, a.read-more:visited {
    	right: auto;
    	left: 366px;

    The featured images themselves cannot be adjusted in CSS without losing quality. To see an example, try adding this to your Appearance → Custom Design → CSS editor and clicking the preview button:

    .featured-image a img {
    	width: 100%


    Thanks very much, I’ll give it a go!



    designsimply – it looks FANTASTIC. Thank you so much x


    Cheers :)

The topic ‘CSS – remove sidebar / change column width’ is closed to new replies.