Print Topic - Archive

E-Blah Community  /  Forum Support  /  Problem applying background to messages
Posted by: Apollo, May 4, 2008, 7:00pm
I've applied a background image to the message text area defined by .postbody

.postbody {
     background  : #0000ff url("http://www.secretscotland.org.uk/pub/images/entrybg.png") 0px 0px repeat-x;
}

While it appeared to work, the application has proven to be inconsistent, and I can't see an obvious reason.

Basically, the background appears as desired only on the first massage posted in a thread, and covers the whole area where the message text can appear, regardless of its height as determined by avatar and other info to the left of the message.

On the second, and subsequent messages, instead of covering the whole message area, the background image is applied only for the height occupied by the text of the message. The image stops at bottom of the text, and only the plain background of the message area appears below.

This thread provides a sample of the behaviour, and I wondered if there was a fix, or if I should just forget it, and the image can't be applied using the current layout...

http://www.secretscotland.org.uk/forum/m-1204146640/
Posted by: pcmantinker, May 8, 2008, 2:32pm; Reply: 1
I see that you have a gradient background. I have one on my forum as well. What you need to do is where it says:
Code
.postbody {
     background  : #0000ff url("http://www.secretscotland.org.uk/pub/images/entrybg.png") 0px 0px repeat-x;
}

modify to:
Code
.postbody {
     background  : #finalgradientcolor url("http://www.secretscotland.org.uk/pub/images/entrybg.png") 0px 0px repeat-x;
}

You need to find the hex value of the final color in your background gradient and put that in where it says "#finalgradientcolor" so that it will be something like "#fff089".
Posted by: Apollo, May 9, 2008, 4:44pm; Reply: 2
Thanks for the try... but it missed the detail of the problem :(

As you note, we share a shaded background, but this is styled in the body, which appears behind the forum at all times. Applying the background images, and then defining the final gradient colour so that it runs on from the bottom of the image work fine there, exactly as expected.

The problem appeared when I tried to do the same trick when styling .postbody which shows the problem described in my first post above (so I won't repeat).

Unlike the application of the method to body, where the colour is applied as well as the images, and therefore can be seen when you scroll past the bottom of the image, when the method is applied to .postbody then the application of the image and colour seems to follow and 'OR' rule, and apply the image, if there is an image specified or available, OR it applies the colour as a default if the image is not specified or available.

What it refuses to do is apply BOTH, and allow the colour to appear after the image ends.

The odd thing, as noted in my initial message, is that it does work on the first message area at the top of the thread shown on every page, but all the rest below that just show the backgound image for however far the text last.

Hard to explain - looking at the actual effect in the sample thread I linked in the first message is probably easier.
Posted by: Martin, May 11, 2008, 12:14am; Reply: 3
You need to change MessageDisplay.pl, look for:

Code
<td class="win2 vtop" style="height: 100%">


and change win2 to postbody
Posted by: Apollo, May 14, 2008, 6:25pm; Reply: 4
Ah, I see where I was going wrong as it were, and what help a little more knowledge of the core can do for you.

I did play around with win2 at an earlier stage, but that doesn't really look at all good when used in this way.

A pity that using this would break my rule of not tampering with core code - since all such transgressions (might) evaporate come the next upgrade.

Thanks for the tip though, as it saves me spending ages fiddling and wondering :)
Posted by: Martin, May 15, 2008, 10:27am; Reply: 5
You should do what you had before and change your template.css

Code
.postbody {
     background  : #ffffff url("http://www.secretscotland.org.uk/pub/images/entrybg.png") 0px 0px repeat-x;
}


( ffffff should be changed to your preferred final gradient colour. )

Then just change MessageDisplay.pl as per post above.

I've tested it here: http://www.opportunitynowhere.co.uk/cgi-bin/forum/Blah.pl?m-1208734149/  and it does what you want it to do.
Posted by: pcmantinker, May 15, 2008, 4:03pm; Reply: 6
That's similar to what I said before, I just didn't understand the entire problem. I hope you get it working.
Print page generated: August 20, 2008, 2:29am