WordPress.org

Support

Support » Themes and Templates » Twenty Fourteen » Widen the Sidebar

Widen the Sidebar

  • Hi, I just installed and have started using the Twenty Fourteen for the first time. Normally a fairly simple piece of .css to track down – but with 2014, I can not find the lines needing to be changed to widen the left main sidebar?

    Any Ideas?

    Twenty Fourteen

Viewing 3 replies - 1 through 3 (of 3 total)
  • It looks like there are two media queries where the width is reset.

    #secondary { width:122px;}

    and

    @media screen and (min-width: 1008px) {
    #secondary { width:162px;}
    }

    Hi mrtom – Many Thanks for Posting ~ Yes ~ I have tried adjusting the second entry you posted there:

    @media screen and (min-width: 1008px) {
    #secondary { width:162px;}
    }

    but that adjusts the content within the sidebar – widen that value and the text stretches without word-wrap, and is lost as it moves over beyond the sidebar sizing.
    I cannot find a 122px value for #secondary, as you have it exactly there in my stylesheet? But there are these:

    (line 3225) #secondary,
    	#supplementary {
    		padding: 0 30px;
    	}
    
    	.content-sidebar {
    		border: 0;
    		float: right;
    		margin-left: -33.33333333%;
    		padding: 48px 30px 24px;
    		width: 33.33333333%; (?)
    	}
    
    (line 3596) #secondary {
    		background-color: transparent;
    		border: 0;
    		clear: none;
    		float: left;
    		margin: 0 0 0 -100%;
    		min-height: 100vh;
    		width: 122px;
    	}
    
    (line 3928) #secondary {
    		width: 162px;
    
    	.secondary-navigation,
    	.secondary-navigation ul ul {
    		width: 222px;
    	}
    
    	.secondary-navigation ul li:hover > ul,
    	.secondary-navigation ul li.focus > ul {
    		left: 202px;
    	}

    You’ll notice the width value of the block at 3596 corresponds to your #secondary {width:122px} – I have tried adjusting this value – no change. Also the % value I question-marked – again, no change – its got me stumped.

    Hi Foxsch,
    I struggled with it too. Found it at line 3965:
    .site:before {
    width: 222px;
    }

    Change that to the width you want in your child style.css

    Johanna

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Widen the Sidebar’ is closed to new replies.
Skip to toolbar