UGH: UGly Headline replacement

chaotic test page

how simple can it get?

Test of concept...
...ok, so the ugly banner is gone now.

#container,#ugh {
height: 100px; 
width: 600px;
overflow: hidden;
background: #fff;

#ugh {
background: url(uglyheadlinebanner.jpg); 
margin-top: -100px; 
position: relative; 
z-index: 1;

#container h4 {
height: 100px; 
font-size: 1.6em; 
margin: 0!important; 
padding: 0 4px; 
line-height: 100%;
overflow: hidden;


No, this is not the ultimative IR-method, but it sure is working across browser-land. I have a weakness for solutions that'll actually work, and I'm sick and tired of all the "smart-but-not-working-in-all-cases" solutions that replaces perfectly good text with "something else".

So my UGH method doesn't pretend to be smart at all, but I think it is valid and working, and I also think it is perfectly accessible for anyone who want access to it. That's all that matters here — not that any of this matters much to me since I rarely ever use “image-replacements”.

In short: this is a joke that can out-maneuver most serious attempts on Image Replacement. It is at least ten years older than the world wide web, it rarely fails and it is simplicity itself.

Turn off images...
Turn off CSS...
Run it through a 'screen reader'...
I think it will come through anyway.

No, I didn't care to test, since I probably won't use it.

available browsers:

win2K: 7.54, 8.00
Mac OS-X: 7.54
win2K: 1.7.2
win2K: 1.0
Mac OS-X: 1.0
Mac OS-X: 1.2.4
win2K: 6.0

go to test-menu