Проблема с позицией спрайта в CSS

Question

Я пытаюсь создать фиксированную границу для сайта, которая динамически изменяет размер с помощью окна браузера из этого спрайта (это не идеально, я знаю.): http://fc07.deviantart.net/fs70/f/2011/269/7/0/bordersprite_by_nakos-d4ayzne.png

ДЕМО на jSFiddle

Моя проблема, как вы можете видеть, это вертикальная часть стены. Как #falJ а также #falB являются height:100% они также включают конец нижней стенки с пространством между двумя стеновыми спрайтами. Есть ли способ заставить backround-position использовать только вертикальную часть стены без конца нижней стенки?

Заранее спасибо.

Answer 1

Решение: http://jsfiddle.net/vonkly/Ld43B/

Это не самая красивая вещь в мире, но она достигает того, что вы хотите. Проверьте исходный код и прямую ссылку на фоновые изображения, чтобы увидеть, что вам нужно сделать. В настоящее время он имеет ширину 299 пикселей; Я полагаю, вы будете использовать что-то более широкое.

Я бы также предложил добавить некоторые отступы вокруг вашего контента (с помощью тега ap, span, другого div и т. Д.) - то, как он настроен в настоящее время, не рекомендуется для удобства чтения.

РЕДАКТИРОВАТЬ

Единственный способ, которым я могу вообразить, чтобы получить прямоугольник с шириной и высотой флюида с имеющимися у вас границами так, как вы хотите, - это использовать второе изображение для запада и востока, содержащих div. Это должно работать с вашим текущим методом.