Removing padding on homepage via child theme

[Historical Forums User]

Very easy question…

Based on the screenshot:

How do I remove the padding around the image slideshow plug in? Above and either side are most important to me but knowing how to eradicate all would be useful.

I was hoping of some padding section in the body area of the code where you specify four numbers representing each side of the body padding. Have yet to find this though.

So you know, yes I am working in a child theme and so far my style.css code looks like this:

@charset “UTF-8”;
/*
Theme Name: TwentyEleven Child
Desciption: Child Theme for the Twenty Eleven Theme
Author: Douglas Fayers
Template: twentyeleven
*/

@import url(“../twentyeleven/style.css”);

body {
padding: 0 0;
}
#page {
margin: 0;
max-width: 2000px;
}
Any help greatly appreciated, thanks!

[Paulie_D]

We’re probably going to need to see a link to the site.

BTW…fixed your code quoting & img link.

[Historical Forums User]

Thanks!

Here’s a link…

http://dnaproductionsuk.com/

I wasn’t actually activated. I was editing the child theme code and previewing before I activated it, taking the place of Twenty Eleven. Now it’s changed the whole layout! WHat the image shows is what preview showed me, and what it looks like now is what happened when I activated. Any ideas?

[Paulie_D]

I’m no expert on WP (or even a novice actually) but just looking at the classes attached to the page would seem to indicate there is something fundamentally wrong with the template(s).

class=”home page page-id-4 page-parent page-template-default single-author singular **two-column right-sidebar**

[Historical Forums User]

There is, that’s for certain! I just don’t know what…

[Paulie_D]

Insofar as there is very little in your child theme CSS, I would suggest turning it off and seeing if the layout returns to normal.

If it does then you have at least identified the source of the problem.

I’m also wondering if the @import is even working right.

[Historical Forums User]

Yes, when I reactivate Twenty Eleven the layout returns to normal. Do I need to copy and paste all relevant code from the parent to the child then?

What would you suggest with the @import?

[Paulie_D]

As I said, I’m no WP expert.

I don’t know specifically what the child theme is doing to WP. My initial suggestion is to delete all the ‘new’ styles from the child style sheet and leave just the import statement.

If everything works when you have done that, start adding back the new styles one at a time until it breaks.

[imprintedimaging]

Just having a really quick look through the rules on the site, there is a TONNE of additional padding being pulled from the original CSS file… a lot of it duplicated.
Give me a half hour or so, and I’ll see if I can duplicate what’s going on, and then I might be able to point you in the right direction :P

For starters though, change the margin rule on #page to “0 auto”. The “0px” you have there means that anyone on a 27″ iMac sees the entire site sitting on the left, and the small OCD part of me is going insane :)

[Historical Forums User]

Haha! Ok I’ll do that now, any insight you can give is appreciated.

[imprintedimaging]

First, change your child style.css code to this:

@charset “UTF-8”;
/*
Theme Name: TwentyEleven Child
Desciption: Child Theme for the Twenty Eleven Theme
Author: Douglas Fayers
Template: twentyeleven
*/

@import url(“../twentyeleven/style.css”);

body {

}

#page {
width: 90%;
max-width: 1280px;
}

After playing with it for a while now, I’ve decided that I hate the plugin you’re using :) If you were happy enough to modify some php slightly, I could run you through how I would change it. Otherwise, someone with past experience with that plugin may be of more use.

[imprintedimaging]

How are you putting the slideshow in the page? Widget, shortcode, …?

[Historical Forums User]

I just solved this problem! Argh, it took the best part of a day but it’s done. I pasted this at the beginning of the style sheet if anyone is interested.

.page.singular .hentry { padding-top: 0; }
.page.singular #content{ width:100% ;margin: 0;}
.page.singular .entry-header, .page.singular .entry-content, .page.singular footer.entry-meta, .page.singular #comments-title
{ width: 100%; }
.entry-content #leftsample { margin-left: auto; margin-right: auto; }

[Paulie_D]

Fair enough.

I hope that solution works in the future as you add more content though.

[Author]

Posts