Text fade in and out CSS
I want to make the text go transparent in the top and bottom of the circle and be able to scroll
6 Replies
hard to know exactly how to answer this without seeing some code but for your text going transparent I'm guessing a CSS gradient
mask-image
is what your looking for: https://developer.mozilla.org/en-US/docs/Web/CSS/mask-imageMDN Web Docs
mask-image - CSS: Cascading Style Sheets | MDN
The mask-image CSS property sets the image that is used as mask layer for an element.
By default this means the alpha channel of the mask image will be multiplied with the alpha channel of the element. This can be controlled with the mask-mode property.
Thank you, It worked
How is the height on the ul working? I keep getting it drilled into me that heights in percentages don’t work without having a declared height on the parent (in this case the div). … but this is working
heights in percentages go off the parent's set height, and the height is being set by
aspect-ratio: 1;
border-radius: 999px; width: somevalue; aspect-ratio:1;
is my favorite way of making simple circlesOh I didn’t realize
height
could “see” aspect-ratio given that it can’t “see” 100% from a min-height (which does make sense). Since aspect-ratio is a more concrete value. Thank you I totally glossed over the aspect-ratio being the “height” as a possibility