Coraline sidebar width change – how to?

  • jukooz

    (@jukooz)


    13 years, 5 months ago

    Hello,

    I customizing Coraline theme (making custom child theme). Can someone tell which parameters in style.css should I change to decrease sidebar width (and increase main content width) when using Sidebar-Content layout (one sidebar on the left)?

    I’m little bit afraid to do this blindly.

    Thanks in advice.
    Love wordpress and this forum.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator t-p

    (@t-p)

    13 years, 5 months ago

    Site URL if available?

    Thread Starter jukooz

    (@jukooz)

    13 years, 5 months ago

    I can’t give URL of my site, sorry. But You can check it here. It’s reversed – content left, sidebar right, but if You can tell how it could be done there, which values should be changed, I’ll easily figure out how to do the same with my theme.

    You can download theme from here.

    Thanks in advice,
    jukooz

    esmi

    (@esmi)

    13 years, 5 months ago

    In order to help, we really need to see the theme in use on your site with your content.

    Thread Starter jukooz

    (@jukooz)

    13 years, 5 months ago

    I can’t give You that, really. But if You could tell me how to decrease sidebar width (and increase content width proportionally) on this site it would really tell me everything I need. It’s the same theme with default settings (same settings as if it was just installed from here).

    You are very helpful to me esmi. Thank You.

    jukooz

    Thread Starter jukooz

    (@jukooz)

    13 years, 5 months ago

    Messing blindly with CSS I found that these parts of code are responsible for content and sidebar widths:

    /* 2-column layouts */
.two-column #container {
	max-width: 770px;
}
.two-column #content {
	width: 64.99%;
}
.two-column #primary,
.two-column #secondary {
	float: right;
	width: 30.4%;
}
    /* Sidebar-Content layouts */
.sidebar-content #content-container {
	float: right;
	margin: 0 0 0 -30.4%;
}
.sidebar-content #content {
	margin: 0 0 0 35.1%;
}
.sidebar-content #primary,
.sidebar-content #secondary {
	float: left;
}
.sidebar-content #secondary {
	clear: left;
}

    I was messing with it and writing what I thought certain values were responsible for in the same time. And I finally got where I wanted to. I changed 3 values.

    .two-column #content {
	width: 74.99%;
    .two-column #secondary {
	float: right;
	width: 20.4%;
    .sidebar-content #content {
	margin: 0 0 0 25.1%;

    Is it enough. It looks good ok for me, but what for people with different screen resolution?

    This CSS thing seems to be quite illogical to me. Have to learn it.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Coraline sidebar width change – how to?’ is closed to new replies.