Bad position of bottom background in responsive mode

Question

When I switch to responsive mode, bottom white image is not at the bottom of parent ul element.

Can you please help me with this? Image has position:absolute with 0 (marked with red rectangle on provided screenshot) from bottom of parent element so it should be working without problem....

Here is link to page where you can inspect elements: Slider

Answer 1

The probleme reside in the fixed height in the background pseudo element :

so try to set height dynamicly using calc css3 and set background-size to 100% :

.slideshow:after {
    content: "";
    background: url(../img/bottom.png);
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(31%);
    z-index: 999999;
}