How to make <div> fit image width
Hey there, I need help with this weird problem I have(see screenshots). I am trying to justify-content with these flexbox images, but I can't because of these weird spaces between each images that end up taking all the spaces horizontally, which prevent me from justify-content. As you can see on the screenshot, I want to get rid of the red section, and make the div fit the image instead of overflowing until it touch the next images on the right. I joined my CSS code snippet, maybe it will help.
(I am quite new to web development and its my first time posting for help, so if the way I am asking my question or how I present my code snippet is not how it should be done, please guide me so next time I can ask using the good practice, thank you)...
Free-trial days left indicator
Hey, any suggestions how to achieve this? Trial period is 14-days-long, there are 5 circles to indicate at what stage of this trial period the user is. How to change their colors without changing the color of anything else? Thanks in advance.
Keep element in viewport up until a certain point
I'm currently facing a challenge i'm not so sure about how to approach and curious with what kind of solution some of you smart people over here come up with. Basically I have a page with multiple sections and one of those sections has an image with some text next to it. When I scroll down further, I want the image to follow the viewport, until the text from the next section arrives next to the image. Then, when I scroll down even further, the image should leave the viewport together with the te...
Section html css
Hi guys, I would like to know how I can make this type of division between sections in HTML and CSS
Code review - Stats preview card component
Guys, I would like you to give your opinion on the best way I should have used to build this component. I struggled for two days to make something that worked, even if it was full of 'hacks'.
Github repository: https://github.com/sircarloschaves/stats-preview-card-component
Live site: https://sircarloschaves.github.io/stats-preview-card-component/...
Triggering an animation based on scroll position
Hi there,
I'm working on a website, and I've been wanting to recreate the following image. Not the design but the animation. It slightly moves left or right depending on whether you scroll up or down as you can see in both images.
I do know how to trigger things when they appear in your viewport but that's only once, this seems to be something entirely different. ...
What are the best practices for the number of srcset items for a dynamically sized image?
I have the ability using server side rendering to render as many different source images as necessary, given that the library (in this case, sharp) can render any size requested.
When is the overhead of having too many possible permutations of sizes a performance hinderance? It seems like no matter what if you are selecting only a handful of sizes, your images are not being optimally sized for every possible screen size.
I've Google searched for any kind of best practice information on this topic and have come up dry in finding any official recommendation from Google, Apple, Mozilla, or other browser makers, or any of the HTML W3C Draft docs and discussions....
Grid as a child of a flex doesn't work properly
Code: https://play.tailwindcss.com/XSMPnICSXN
As you can see the green squares are overlapping each other and the red container is overlapping them as well. What I want to achieve is something like that. I tried using
width: 100% as well but it still doesnt work...