Seamless background with repeat-y?

[Vondoom]

Hi, I’ve got a blog estructured like this:

___

| A |

—

| B |

—

| C |

—

Where A and C contain static background images (header & footer) and B is a repeatable background. Problem is the union of the 3 sections was supposed to look like a seamless image, but as you may imagine it doesn’t work right now due to the bottom part of B occasionally being cut by C (depending on the length of the post, of course). Is there any way to make sure that every instance of the repeated background is always fully displayed?

[Chris Coyier]

min-height on B?

[Vondoom]

Would only work without repeats. I would need some kind of code that sets up a min-height equivalent to the full vertical size of the image and multipliers.

[Vondoom]

I may have explained myself incorrectly because that page suffers exactly from the same problem. If you take a look at it, the last b-repeat is cut in half, which is what I’ve been trying to avoid

This is the blog:

http://sgt08film.blogspot.com/

(As of now I’m using a kinda crappy background in the middle, not the one I want to use)

[whiteInkDesign]

If your bg img for section B is something like 100px in height you might be able to set a min-height of 100px for B then use js to force section B to increase only by increments of 100 every time content starts to increase the height of the section, I wouldn’t be able to say for sure if this is possible though.

[Vondoom]

Does anybody know the js for something like that?

[Author]

Posts