// Internet Duct Tape

Greasemonkey Script: Find images that are too wide and break your blog template

Posted in Firefox and Greasemonkey, IDT Labs Software Development, Technology by engtech on January 12th, 2007

Ever try to stick a 550 pixel-wide image into a 500 pixel-wide space? Firefox will increase the space, but under Internet Explorer 6 (or lower) it will move the sidebar so that it comes AFTER the blog posts.

Figure 1: Crappy MSPaint drawing explaining what I’m talking about.

Inserting an image that's the right widthInserting an image that's too wide in FirefoxInserting an image that's too wide in Internet Explorer

Blog themes come in two flavours. Fluid/liquid where the template stretches around the content to use the maximum width and fixed where the template will always be a certain number of pixels wide.

Problems can arise when using a fixed width template with images. If the image is too wide to fit it can stretch the fixed width section. This can break your sidebar in Internet Explorer 6 by pushing your sidebar so that it comes after all of your content.


As a Firefox user I don’t “test” my blog in Internet Explorer 6 very often (even though it still has 50% of the browser market share). So I needed a script that scans my blog and warns me if I’ve added an image that is too big and will break my blog template under IE 6.

What it does

  • Warns if images are too big and will break your blog.
  • Suggests dimensions for resizing images so they will fit.

Figure 2: Highlighting which image is too big and breaks the theme.

greasemonkey-imagewidth-sample.png

Find out more information and how to install/configure this Greasemonkey script.

3 Responses to 'Greasemonkey Script: Find images that are too wide and break your blog template'

Subscribe to comments with RSS or TrackBack to 'Greasemonkey Script: Find images that are too wide and break your blog template'.

  1. engtech said, on January 12th, 2007 at

    Please post all comments here:

    http://engtech.wordpress.com/tools/wordpress/findwideimages/#respond

  2. [...] that script Rooster so rightly pointed out that my script for “making sure you didn’t break your blog template in Internet Explorer 6 when posting new images” doesn’t have a [...]

  3. Name that script « Internet Duct Tape said, on July 20th, 2007 at

    [...] that script Rooster so rightly pointed out that my script for “making sure you didn’t break your blog template in Internet Explorer 6 when posting new images” doesn’t have a [...]