Streaming live at 10am (PST)

I put an arrow image indicating to scroll down disappeared


#1

In this “about” page, I put an image(arrow down.svg) to show visitors that they can scroll down for more information. but as soon as I change the position “absolute”, the SVG file became invisible. What should I do?


Here is my site Read-Only: https://preview.webflow.com/preview/ux-portfolio-a0b296?utm_source=ux-portfolio-a0b296&preview=d9c9e0c38d9fd5507735752749de57c9


#2

Add a z-index of 1 to the image.

Also read here to be sure you’re mastering absolute positioning http://inb4.webflow.io/posts/master-absolute-positionning


#3

Thank you very much. It was visible on my screen right after I fixed z-index. but I added some interaction and it’s invisible again. Do you know why by any chance?


#4

Because of defaults most likely. Positioned and not positioned objects have various defautl values and weight for z-index. Sometimes just declaring one element positionned without any value is enough to give it more weight. The fact you added IX can make the browser consider some elements more important in term of z position.

I add info here from time to time, to try to explain z-index and how it works: http://z-index.webflow.io/