开发者

CSS woes in IE6/7

I have created a Wordpress child theme based on Thematic and I'm currently trying to debug the site in IE 6/7. My suspicion is that the problem is hasLayout, as that seems to be very common and the symptoms are congruent, however I have checked many of the broken elements and added hasLayout properties to those that did not already have them with no advancement.

I did have z-index set in several of the CSS classes, which I have now removed, and I'm wondering if any of you have some other suggestion about other debugging approaches.

The site is: http://032b4a6.netsolhost.com/WordPress/

I have posted here instead of the Wordpress forum as I believe my problem is more related to a standard CSS issue than anything specific to WP.

EDIT:

To detail开发者_运维问答 the kind of errors I experience in IE6/7:

The header, which is an anchor with a css background property, pushes down on the search box, causing large gaps.

The nav displays as if it has an extra 75px of margin under it, causing another large gap.

The right sidebar is missing. It can be found just barely peeking from the left side of the container below the left sidebar.

The left sidebar appears to have an extra 15px of left margin, pushing it onto the main content div.


To check if a layout problem in IE6 / IE7 is hasLayout-related problems, I sometimes find it useful to use a rule like this for debugging - it's propably not something you want to use in your final stylesheet (as it will probably introduce new problems), but often it can reveal what elements needs to be given layout:

* {
    zoom: 1 !important;
}


Welcome to the world of conditional comments and IE stylesheets: http://codex.wordpress.org/Conditional_Comment_CSS You need to tweak the CSS for IE and test with native IE, not browser shots.

Try taking the slider out for a minute to see if there is a CSS conflict.

And you have a few minor html errors, one having to do with an inline style sheet: [Invalid] Markup Validation of 032b4a6.netsolhost.com WordPress - W3C Markup Validator. Scroll down in the validation report to see line numbers and source code.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜