Drupal YUI Rich Text Editor: Set maximum image dimensions on uploaded images

The search for the perfect WYSIWYG text editor in Drupal goes on. The best I’ve seen yet is YUI Rich Text Editor, but it still has some serious browser incompatibilities and usability problems. One significant is that there is nothing stopping users from upload a huge image, and not resizing it down using the provided resizing tools.

Now that just most cameras produce images of enormous resolution, users in my Drupal sites’ users often upload gigantic photos, which remain splashed across the entire layout until I get around to fixing them. I finally got tired of correcting users’ posts for them and fixed the CSS so it will never happen again.

To fix the problem on your own Drupal site, open style.css for the theme(s) you are using, and add this style at the end:

.content img {
max-width:550px;
  width: expression(this.width > 550 ? 550: true);
}

The line
width: expression(this.width > 550 ? 550: true);
is for IE 6, which does not understand “max-width.”