View Full Version : center left-aligned text over watermark

11-26-2005, 10:13 PM
I want to center multiple paragraphs of left aligned text over a water mark, and be standards compliant.

my html code is like this:

<DIV id="watermark">
<DIV class="text">This is the first paragraph about this, that, and the other day.</DIV>
<DIV class="text">The second paragraph is a little below, and not indented. Just blah blah about how much college chemistry is bad.</DIV>

my css, really isn't working out. here's what i got.

/* CSS */

#watermark {
background-image: url(images/watermark.gif);
background-position : center;
background-repeat : no-repeat;
min-height: 300px;
padding-top: 25px;
padding-bottom: 25px;
text-align: center;
.text {
width: 400px;

firefox has the text aligned to the left, and not centered over the water mark. IE has the text over the watermark, but completely ignores the min-height property (is that what it's called?)

I care more about the text being centered over the watermark in FF, than anthing in IE. what do you suggest?


11-26-2005, 11:57 PM
IE doesn't support min-height, however another bug in IE6 will allow us to fake min-height. Add this to your CSS

* html #watermark {
IE resizes its containing elements height when the content exceeds its height.
The * is a universal selector. Saying that anything inside of the html tag and in the universal select will be used. IE should ignore this because its invalid but it doesn't hence why it only works in IE. I'm sure what you mean by centering text. Perhaps you can post a link or at least tell us where that image is located?