Edit the rule for
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
margin: 0 auto;
to
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
margin: 0;
Thanks Tom – that’s brilliant! Worked perfectly
oops, one slight problem tho,
the left column shifted nicely to the left as I wanted, but the right hand column is now UNDER the left column, as if the page itself is not wide enough. How would I set the width of the page to accommodate the two columns. I am quite familiar with HML/CSS but rather new to WordPress….
@picknick – do be aware that editing theme files is a very bad idea — especially in a WP default theme. All your change will be lost when WP is updated and you should also always have a clean copy of he default theme for troubleshooting.
Instead use a child theme.
http://codex.wordpress.org/Child_Themes
Thank you. I’ve done that. So do I take it that when I edit the CSS in the Editor I am now editing the child theme?
Excellent. Yes, any CSS changes should go in the new (empty) child theme style.css file. If coded properly (i.e. specific enough), they will override the parent theme styles — child styles are loaded after the parent styles.
But your site is not currently using a child theme (at least not the page linked to above) — did you activate the child theme?
So the child style.css has to be EMPTY? I assumed it would just be a copy of the original that would include adaptations. I am very CSS and HTML literate, but even so it is impossible to guess which css attributes apply to which aspects of the web page. EH. It was easy to change that left margin, but I wouldn’t have had a clue if I had been tipped off. I am keen to get to grips with WordPress but must say I find everything much easier in standard web design software when I know exactly all teh XHTML tags and the CSS attributes off by heart. I have desigend several websites but this is teh first using WordPress, which I was led to believe was easier but so far seems to be much harder! Thanks for you time
The child style.css is not empty. Did you read http://codex.wordpress.org/Child_Themes
I would maybe recommend modifying the CSS of a simpler theme instead of twenty eleven which is a fairly complex theme. Maybe http://wordpress.org/extend/themes/simple-catch
Also debugging CSS is very easy if you install the firebug plugin on firefox. You can inspect CSS styles by mousing over the appropriate blocks.
I read the child themes info and didn’t see anything about it havingt o be empty. I’m happy to take your advice on any theme recommendations – I don’t really care myself. It only has rto accommodate a simple magazine format for a client of mine. But I have to say, after ten years designing websites, it would have taken me no more than a minute to set up the two column page – now it’s taken me hours of stress. Is wordpress really the answer?
Ok, if I take your advicer, how do I adopt the new simple catch theme and replace the 2011. And do I still need my child theme, and if so, what should bed in it and where should it go?
I am only doing this section of his website in wordpress – teh rest I will go back to doing in much simpler XHTML/css
Your help is appreciate dby tehew ay and I am at least impressed by teh speed of responses on here
As you are experienced with CSS I would recommend that you actually ignore the info about creating a child theme. Its just recommended for users that have little experience and we don’t want users to mess up their blogs in such a way they can’t go back to what they had before.
Just install the Simple catch or any other simple theme and have a play around with the style.css file using the inbuilt editor. You probably just want to play about with the Content section, themes unfortunately have to be applicable to many different site variations so the CSS files become very bloated.
Unless you want to lose all your changes when a theme is updated, you should use a child theme or custom option or plug-in.
The child theme style.css file starts out with no styles — except the @import line. Then you add changes to the CSS to the file. It’s not a copy of the parent stylesheet.
The best and very easy way to identify the CSS code you need to change is to use Firebug addon in Firefox. It also allows you to make temporary changes to the CSS code — so you can test things before making them in the actual code. Highly recommended.
Ok, I’m sure I can adapt it to what i want anyway. This 2-column page is the only one that’s proving difficult – and it’s ironic because all the other pages will be a simple single column asnyway! I just wanted a 2 column page to list the magazine contributors on the left column and a wider column to the right for the content. Once that’s done I can CSS all the tags myself to get the right look I’m after.
One last thing to check tho – my website DOES reference the CSS files on MY website and not a remote wordpress website. I was just a bit puzzled by the URI cited at the top in teh CSS editor
One last thing to check tho – my website DOES reference the CSS files on MY website and not a remote wordpress website. I was just a bit puzzled by the URI cited at the top in teh CSS editor
Not sure what you mean??
All CSS styles are only on your site unless you set something else up.
The best way to get two columns will be to use a theme that has that option built in.
Hi
Not sure. There is only one page I want with two columns and I have done that already with a couple of DIVs. The rest are all single column. Thed only remaining problem is that my two columns only fit if they are both quite narrow, whereas I want the left to be narrow and the right to be about twice as wide. It just seem I need to fiddle with the page to make it accommodate a wider right hand column.
PS Does this Firebug plugin only work with Firefox?
