How's that better than the following? Just being curious as I always opt for the following if for some very specific reason flexbox is not the option 😂:
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
Front-end engineer and Co-Founder @VisualEyes. Striving to write clean and maintainable code by using modern web technologies. Currently passionate about Node, ReactJS, Three.js, CSS animations.
Location
Greece 🌎
Education
Master in Electrical & Computer Engineering
Work
Indie Hacker, Front-end engineer and UI designer at VisualEyes
However, this little hack comes in handy when I need to position an element relative to its parent. i.e. an "X" icon at the top right corner of an image.
How's that better than the following? Just being curious as I always opt for the following if for some very specific reason flexbox is not the option 😂:
One more CSS instruction I guess 🤣It seems clear and straightforward though, I liked it 💪
The "wat" image just about killed me. Seriously nice tip, has come in handy for me often!
hahaha glad you liked Trev 😊
That's clever 🤩
Thanks man 👏
My most up voted stack overflow answer was about this 😁
top:0 (default)
By default, your element is at the top of the page, and the top of the element is at 0:
top:50%
When you move it down by 50% height (50% of the entire page), the top of the…
Nice detailed answer. It's a tricky topic 💪
Nice, thank for sharing
Really happy you liked it 😊
Resize the window until reached half of the screen, you will see an unwanted scrollbars.
Doesn't grid do this automatically with justify-items:center?
Sure! Grid or flexbox are my main ways to go too.
However, this little hack comes in handy when I need to position an element relative to its parent.
i.e. an "X" icon at the top right corner of an image.
Sometimes i make use of
Margin: 0 auto;
Or
I could just place the element i want centered in a center tag