ThemeShaper Forums » Thematic

sidebar on the left!

(8 posts)
  • Started 11 years ago by xmasarrow
  • Latest reply from BrightBold
  • This topic is resolved
  1. xmasarrow

    Hi there, I have this problem and I really hope somebody can help me with it...
    I am trying to apply my own design to thematic with wordpress, using a child-theme...
    So I want to have the sidebar in the left side. I have added the content of the "2c-l-fixed.css" from the thematic/library/layouts/2c-l-fixed.css to my child theme in the style.css file. So far so good, the sidebar switches to the left side but it seams that about 10-20 pixels from the left side of the sidebar are not visible(!!???!!?)
    to be more precise I cannot see the "S" from the Search, the "P" from the pages, the "C" from the categories... and so on... I know this is weird and I imagine that I am doing something wrong but please if someone can help me with that I would be more than grateful...

    Posted 11 years ago #
  2. Can you post a url?

    Posted 11 years ago #
  3. I had a similar problem with the 2c-l-fixed stylesheet (also copied to my child theme), except in my case it was cropping the right side of the main content. I thought it might have been because the width of #content is 620px but the width of .hentry is 630px. But I didn't spend a ton of time trying to analyze your CSS so there may have been a perfectly good reason that .hentry is wider than #content.

    Unfortunately, I have since significantly modified my theme so can't link you to my example, and I also can't remember whether I had modified anything that might have caused the problem. My memory is that at that point I had only changed colors and made changes to typography.css, but it's possible I had done something more significant to break your theme.

    Posted 11 years ago #
  4. @xmasarrow & @BrightBold... I had the same issue when I was first testing out Thematic a few weeks ago. It seems my theme's previous settings were still in cache memory.

    Be sure in your child theme you add...

    /* reset browser defaults */
    @import url('../thematic/library/styles/reset.css');

    That will reset (neutralize) everything so your new settings/layouts should take effect. Without seeing a link to your blog it's difficult to tell but when I had that problem, that was the solution.

    Posted 11 years ago #
  5. xmasarrow

    Hi there,
    I have used a child theme. I have copied the style.css for the One-Column (Left) Fixed LAYOUT to my child theme style.css file. (sorry for the popup is a free hosting)
    Same error in Firefoc, IE7, and CHROME.

    --> marti garaughty I've tried to add "@import url('../thematic/library/styles/reset.css');" to my style.css file:

    Theme Name: kraft
    Theme URI:
    Description: Built on Thematic Theme
    Author: Cristi Antohe
    Author URI:
    Template: thematic
    Version: 0.1
    All Rights Reserved
    /* reset browser defaults */

    @import url('../thematic/style.css');
    @import url('../thematic/library/styles/reset.css');

    but nothing...

    Maybe somebody can help!

    Posted 11 years ago #
  6. @marti garaughty: Of course I can't test it now, but that definitely could have been my problem. At some point I realized I had forgotten to add the "../thematic/" to the beginning of my @import line for the resets. So it's quite possible that at the time I was having the problem, I wasn't actually importing the reset stylesheet. Thanks.

    @xmasarrow: OK, your problem seems to be that when you are importing Thematic's styles.css into your stylesheet, it is importing the 2-col RIGHT fixed layout into it's stylesheet, rather than the 2-col LEFT which is what you want. So the "right:10px" property for the .main-aside is what's causing your problem. Get rid of that import and your problem should be solved.

    Posted 11 years ago #
  7. xmasarrow

    @BrightBold what I am doing is this:
    I have copied the thematic folder in the "themes" folder in the wordpress, I have also created a folder "mytheme". In this folder I have another style.css file, in witch I have copied the content from the file "thematic/library/layouts/2c-l-fixed.css"
    I have added this line to import the style.css:

    "@import url('../thematic/style.css');"

    and this is it... Still not working properly, I still cant see about 10-15 px from the left side of the sidebar...
    About the "right:10px" from the .main-aside, I am not interfering with it an any way, as it is only in the "2c-r-fixed.css" file witch I have nothing to do with...
    I know that I am doing something wrong somewhere... but I dont know what and I dont know where...
    Thanks for trying to help me!

    Posted 11 years ago #
  8. Look in the ../thematic/style.css stylesheet that you are importing into your style sheet. You will see that near the top, it is importing library/layouts/2c-r-fixed.css. So that stylesheet is effectively getting imported into your stylesheet, even though you haven't called it explicitly. Because you have copied the styles from 2c-l-fixed into your stylesheet, you are overriding most of the stuff in the 2c-r, but there's no "right" property in 2c-l so that's getting applied to your main-aside class and causing your problems.

    So you could just remove the line importing the 2c-r file from thematic/library/layouts/stles.css. Or, if you want to be able to upgrade Thematic later without messing up your layout, here's my suggestion for how to proceed (it's a little more work upfront, but could pay off in the long run):

    • Instead of copying the content from 2c-l-fixed.css into mytheme/style.css, copy the content of thematic/library/style.css into mytheme/style.css.
    • Then add "../thematic/" to the beginnings of all the paths in the @import lines so that you are correctly pointing to their locations.
    • Make sure you change the line importing 2c-r-fixed to 2c-l-fixed.
    • Now edit the rest of the mytheme/style.css stylesheet to reflect the design you want on your site.
    • If you end up wanting to edit a property in one of Thematic's other stylesheets (like typography.css, or 2c-l-fixed.css), either overwrite that property in your mytheme/style.css or make a copy of the whole stylesheet in your mytheme folder and change mytheme/style.css to import that copy rather than the one in the Thematic folder. That way you won't have anything you edited in the Thematic folder and you'll be able to upgrade it later if you want.

    My other suggestion, if you're not doing this already, is to install the Firebug plugin for Firefox. This was how I was able to determine your problem - Firebug allowed me to see what properties apply to each element of your site design, which stylesheet they're coming from, whether something in another stylesheet is overriding them, and what happens if you disable them. It's a great tool for troubleshooting your designs.

    Posted 11 years ago #

RSS feed for this topic


You must log in to post.