How to align 0..N items to start and 1 to end, with flex?
I want an item always aligned to the end, while any previous item should be aligned to the start.
How can I do that, with flex?...
How to avoid text to wrap when there's space, using flex or grid?
I want the author to be on the left, the category on the right.
If the container is wide enough, the text should not wrap.
The two elements (author and category) may wrap on small screens (
flex-flow: row wrap I guess?)....
Scale animation with CSS Grid causes pixel gap issues
I have a weird one for you all... it seems that animating the scale while using CSS grid, causes the browser not to calculate the widths quite properly and if you have a 1px gap between the grid items the gap will come in and out as you resize the window
You can see it in action here: https://codepen.io/LanFeusT/pen/RwzGVWK try resizing the browser window and you'll see the grid at the top which has the entrance animation will have the
gap: 1px come in and out whereas the bottom one the gap is always visible
Outside of animating something else than scale (translate for example) I don't really see another solution?...
Overlay on a div with a certain cutout in the middle.
Actually this is on top of a video stream but for simplicity sake lets just say its over a div. I am trying to create a verification system where the user can verify themselves using facial verification.
For the design part I need to display a face cutout overlay on my video stream essentially telling the user to place their face in the cutout to verify themselves. What is the best possible approach to this?
I have provided an image of what I am trying to achieve but for web. ...
How can i apply overlay for the design at bigger screen sizes ?
Hello, I did apply the overlay for the design at mobile screen sizes, but when it comes to bigger screens i can't, i searched Chatgpt, reddit, stackoverflow, and found nothing,
repository:
https://github.com/WaelBenseghir/stat-page
demo Url:...
Ideas required
Hiiiii. I started a personal project. Where I want to show data on a monthly view like the image attached.What I want to do is show each people's info on the monthly calendar in a row according to the dates.
I am posting data on the DB but how do I show it like this. Looking for ideas...
nextjs server actions return undefined
Here is my code, the problem I encountered when calling server actions in the client component. The returned result is undefined
Responsive Layout
Why i got this layout crashed is it because of styling of web fault this happens rarely and then it is fixed by it-self
https://94h77v-5173.csb.app/...
Button with gradient
Hi Everyone! Please could I have some help on how I can achieve something like this.
For context, I am using bulma and sass but I dont mind if there is a vanilla css solution. Thank you.
``` css
.button{...
Automatic scroll with MUI Appbar
Hello all, I implemented a MUI AppBar at the bottom of my page with a Toolbar inside it, because I need a toolbar that remains sticky at the bottom of the page as the user scrolls. The code looks like this.
If you notice where my cursor is, when I press enter, the cursor falls out of view until I scroll down again. This is not a huge deal, but is there a way to also automatically cause the page to scroll when the user presses enter to create a new line? ```<AppBar
position="fixed"
sx={{
top: "auto",...
Customizing editor experience
Hello everyone, I’m working on a e-book maker app where the main feature is a rich text editor inside which authors can write book drafts. I would like to customize the look of the editing experience. Right now, I’m not applying any custom styling to the nodes (h1, h2, …, ul, ol, code, pre, etc.) inside the editor (see screenshot to see what is currently rendered). In order to do that, I would need to pick a custom font, custom spacing between headers, etc. I’m not very experienced with the fro...
