Support » Themes and Templates » Sidebar of child theme drops down in IE only

  • Resolved tracyberna

    (@tracyberna)


    I am up late at night using time I don’t have trying to debug this one stupid thing that stands between me and being finished. Please help me see what I’ve screwed up.

    I made a child theme based on Sunset Theme. It works in FF and Safari, but in IE 6 and 7 the right sidebar drops below the narrowcolumn div. When I set the theme back to the parent template, the sidebar goes back to the right place, so it’s something I’ve messed up in the CSS (although I have changed elements of the template files), but I’m bleary-eyed from looking and can’t tell what. Here are the things I have checked:

    • I shrunk the size of the containing Page div and enlarged the sidebar, so I checked to make sure the narrowcolumn was small enough for everything to fit. There’s now plenty of room for it to clear.
    • I tried floating the sidebar right instead of using a margin-left property. Didn’t help.

    The site is here:
    http://perfectgerman.com/

    The child theme CSS is here:
    http://perfectgerman.com/wp-content/themes/perfectgerman/style.css

    The parent theme CSS is:
    http://perfectgerman.com/wp-content/themes/sunset-theme/style.css

    For the love of all that is holy, please help. (:P Kidding. Kind of.)

Viewing 2 replies - 1 through 2 (of 2 total)
  • I’m bleary-eyed myself, but I -think- this problem might be a math-related one where different browsers do their math differently.

    Have you tried constraining the widths of all the contents within the narrowcolumn and the sidebar (widgets included)?

    Made sure there isn’t any stray (or intentional) padding within the divs adding to the widths of the outer divs?

    Additionally, you’re doing a child theme, right?

    Perhaps the parent theme’s padding is getting into the way here?

    #sidebar{
    	padding: 0 10px 10px 0;
    	margin-left: 573px;
    	width: 180px;
    	}
    #sidebar {
    	margin-left: 558px;
    	margin-top:-5px;
    	width:200px;
    	background: url(images/sidebar_gradient.gif) top center no-repeat;
    		zoom: 1;
    }

    Specify the padding for the sidebar on your child CSS or take into account the parent’s sidebar padding and redo your numbers and see if that does the trick.

    Comparing the two sidebars in Firefox and in IE, IE shows more padding in the sidebar than Firefox does?

    Just wanted to get back to you, EMG, and let you know that you nailed the problem – stray padding and margins in the parent theme were what were messing me up. Thank you so much for helping out!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Sidebar of child theme drops down in IE only’ is closed to new replies.