dustyhawk
asked 10 years ago

Image Hosted by UploadHouse.com As per the screenshot above, i have added the following CSS #sidebar-secondary { width: 360px; #sidebar { width: 165 px; } #container { padding-left: 1px; } My questions are
 
1. in the part of <-Space-> , how do i increase the width of that part so that the text in it will be roughly the same width as <–Space 2–>  ?
2. in the secondary sidebar area, I would like to get each widget to be able to contain items that have a larger width, e.g. 300px

2 Answers
DominicStaff
answered 10 years ago

1. To change width of the left sidebar, you can add the following code to the “Header Code”

 <style>
#sidebar {
    width: 200px;
}
#main {
    padding: 50px 8px 10px 200px;
}
</style>  

2. To change the secondary sidebar, please add the following code to the “Header Code”

 <style>
#sidebar-secondary {
    width: 300px;
}

.widget-inner {
    max-width: 100%;
}
</style>

Hope this helps !

Adrian Ramirez
replied 10 years ago

Then the responsive design is broken, any fix for that?

Dominic Staff
replied 10 years ago

Please add the following code to the “Header Code”

@media only screen and (max-width: 985px) {
#main {
padding: 50px 10px 10px !important;
}
}

İlhan Özen
answered 9 years ago

Hi, I got problem in responsive design too after I added codes above to make sidebar wider. I added this code below that you shared exactly to the end of lines in "Header Code" but I only get it as a text on my main page. I tried to add the code to header.php and "Header Code" section in Customize/Custom Code/Header Code but I only get it asa text in main page. Please help.

@media only screen and (max-width: 985px){

main {

padding: 50px 10px 10px !important;
}
}

ozenilhan
replied 9 years ago

Oh I solved now! Need to take the code between style tags like this:

And write it to appereance/customize/custom code/header code.

ozenilhan
replied 9 years ago

Oh I wrote but where style tags gone?

dominic Staff
replied 9 years ago

You can needn’t use this code in the "customize/custom code/header code" section which you can add this code to the style.css file that needn’t to take the code between style tags. 😀
Note: At the moment, will not display the "style" tags at here.

Powered by DW Question & Answer Pro