Image Slider

[AmaniLouendriz]

Hello @caseyli , @7chris71000 !

I wanted to have an image slider for my home page but I didn't know how to fix the dimensions of my images.. They are so big and I struggle how to put the text in the center instead of the bottom of the image, as well as which colors to use for the text to make it readable.

Thank you and have a nice day !

[caseyli]

@AmaniLouendriz a couple of things you might want to look into if you're coding the slider yourself:

• For the slider, you can always make a container for your images (so like a div that surrounds the img tag). That div, you can dictate the height, width using CSS
• THen from there, you can just make the image inside it height 100% and width 100% to fill that div
• As for how the image appears, it might get stretched and not look right, so what I would do is look into a CSS property called object-fit. It can help with sizing your image
• As for colors of text to make it readable, that you'll have to balance with your images, but some tricks you can do is add a transparent background or a text-shadow to your text to make it more legible

[AmaniLouendriz]

Hello @caseyli , @7chris71000 ,

I hope you're doing well!

I made the changes to the home image slider; I think the dimensions are right now; I have a little issue though; I wanted to put a transparent gradient on my images; but I couldn't use the property background: linear gradient (color1,color2,url) since it's not a background image. So, I've read that adding another div( (for me it was

) and adding the background color to the div could make it happen; but it doesn't seem to work although I have put a negative z-index for the image.

Thank you so much and have a nice day !