Annoying IE Bug: Creeping Text

August 30th, 2007

Web DesignEvery few months I get bored of how this site looks, hence the theme overhaul. The color scheme is slightly different, the fonts have been changed, and some different art is still to come.

I removed a few things from the sidebar and two images (a page background and a footer) that I really can’t remember why I ever had them in the theme - I guess that’s what comes from hacking a pre-made theme. Skelliewag.org has a really great post on de-cluttering your blog that is inspiring some of my pruning.

But in regards to Internet Explorer and “creeping text”: The site looks dandy in Firefox and Safari, but I always hold my breath when it comes to Internet Explorer on a PC. So I checked out few pages and noticed this annoying problem in the comments - basically everything was slowly edging to the left, to the point where the text was appearing off the side of the page:

Creeping Text Internet Explorer

Turns out this is an IE-specific “creeping text” CSS bug (view the link in IE to see for yourself). It happens when block elements are nested within one another, and the elements have only a left border and a bottom padding. Turns out that’s exactly what I was doing in the comments to create the green stripe. While updating the theme, I removed the bottom borders from both the comment <li> and the page <div>, hence the zombie-fied text.
So I added a grey bottom border to the comment <li> and no more creep.

Did I mention I hate Internet Explorer? But according to my server logs a vast majority of people who happen across this blog use it, so I must cater to them somewhat. As a result, I do appreciate that whenever I have a strange web design problem, odds are someone on the Internet has posted a fix. And so I do the same through this post.

RSS Feed Please subscribe to the Webomatica RSS Feed!

  • Mike
    Very nice!! I like the look right now...particularly the illustration in the header.

    Thanks for the IE tip, if I ever hit that problem, I'll know where to look (and point others).

    Have been curious for a while, and I know it's definitely off topic...but, who's the girl on the left of the page?
  • Improvements still coming... the image in the background is from some classic car advertisement from the fifties. I believe I "borrowed" it from this site.
  • IE has other weird bugs, too. My site currently loads two totally separate pages for IE or Firefox/Safari/Opera.

    And I think Safari has another odd bug (but it could be Opera, I can't remember right now). If you put a link tag around an image, but close it after text, it renders the entire page's link as that link.
  • I use Firefox but yeah, many people use IE, so you have to accommodate them. Good post- will file it along with the long line of IE bugs and quirks.
  • Mike
    Pretty crazy...I kind of always figured it was someone you know (or, when I first found this place, I thought it was you). :D

    Thanks for the link, very interesting site!
blog comments powered by Disqus