IG Syntax Higliter CSS Width Fix for IE6

If you have a site with a narrow main content area like this blog then the IG Syntax Highliter plugin can break your layout in Internet Explorer 6. This problem can be easily solved by modfying the file syntax_hilite_css.css. Here is where this file is located:

your_blogs_dir/wp-content/plugins/ig_syntax_hilite/css/syntax_hilite_css.css

Below is the first change I've made aroud line 7, I have commented out the original width and replaced it with a smaller one.

CSS:
  1. .syntax_hilite {
  2. /*WIDTH: 500px*/
  3. WIDTH: 450px
  4. }

The second change required is around line 19, again I have commented out the original code.

CSS:
  1. .igBar {
  2. /*WIDTH: 511px*/
  3. WIDTH: 461px
  4. }

Upload this file to your wordpress install and your site design should now render correctly. In this example I have reduced the width of the code box by 50 pixels you may want to alter yours by a different amount.

/* Pete Graham */

Post a Comment

Your email is never published nor shared. Required fields are marked *