How To Create Inverted border-radius Card With CSS
Vložit
- čas přidán 25. 05. 2023
- This Idea Inspired By Kevin Powell's Videos • Creating an inverted b...
------------------
Click For More : czcams.com/users/OnlineTutor...
------------------
Enroll My Course : Next Level CSS Animation and Hover Effects
www.udemy.com/course/css-hove...
CSS Infinity Course : www.udemy.com/course/infinity...
Another Course : Build Complete Real World Responsive Websites from Scratch
www.udemy.com/course/complete...
------------------
Join Our Channel Membership And Get Source Code of My New Video's Everyday!
Join : / @onlinetutorialsyt
------------------
Source Code : / onlinetutorials
Facebook Page : / onlinetutorialsyt
Instagram : / onlinetutorials_youtube
Twitter : / onlinetutoria16
Website : www.onlinetutorialsweb.com
Buy Me A Coffee : www.buymeacoffee.com/onlineTu...
------------------
#onlinetutorials #csseffect #topcsseffects
------------------
give proper credit if you repost this on other social media platform
------------------
image source : www.pexels.com/
------------------
Disclaimer video is for educational purpose only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use
Loved it! Fun seeing another approach here. Never would have thought of using the box-shadows of transparent circles 👍 - Just made me think of a really simple way to do something that I had been doing in a much more complicated way previously as well, thanks! 😅
The best Crossover ever!!!
Thanks Kevin, you also completed this challenge very beautifully, I learned a lot while doing this.
so are we going to see another approach on your channel sir
Happy to see you both hear Kevin and online tutorials ✌️
@@CMB696 Me too
This is a fantastic approach to solving this challenge. Great tutorial as always.
Im glad you follow these trend challanges between the Css legend players. Cause ure one of them too
I always knew Online Tutorials was crazy with CSS. A literal guru
Good to see this css legends👏
wow awesome logic for the border, i created similar one but code was mess and long which would be trouble for a new guy to read and understand and i used many div elements!!
I love this 😭😭😭🥺😭😭❤️❤️❤️, i even love it more that Kevin replied here and both my legends know each other now 😭🥺❤️
Very clever!
I'll try it out on one of my side projects 😊
Awesome! Very helpful video and I love your approach here... 😉🔥
Excellent job of implementing it this way.
you are our favourite online css instructor 😍 take love brother.
you're amazing! you make it easier!
amazing card and wonderful trick to round the corners so practical thanks a lot
WOW good idea and design and skills
Man gye guru🎉🎉❤❤❤❤
wow bro! awesome
Your video is mind blowing bro ❤❤❤🎉🎉
love it
very nice bro
hey there, with a border radius of 50% by ::after and ::before there are some annoying pixels.
Using a border-radius of 10px makes it better.
Is this a sequel to Kevin Powell's creation ? 😂 ... Loved it by the way
osham boss 👌
thanks
Love to see your design..but make videos also with the help of elementor and copy pasting the codes
Waoow
Pretty nicer way... His looked a little advance. Yours is a little bit simpler
Cant you place the top at a lower z index, gove the bottom one border radius and a border and would work thr same?
I will do this experiment and tell
@@OnlineTutorialsYT it wouldn't work with background image but with a solid color it should work
How to add spots on the image and make it color ful in Elementor?
I understand everything but with video if you have explained what were you doing it would be much more better. but still it was great🎉🎉
❤
Clipping would make css cleaner 😉
what is the purpose for doing position: relative; on all elements ?
its really annoying, isn't it?
yeah
@@abhaykumar9806
Wha was use of those 2 circles at the end??
to use their solid box-shadows to make the desired curves
Kevin Powell?
I think he tried to do it with his own approach after seeing Powell's video
I thought about that too
Hello brother, I was working on one project but their is one problem I don't know how to animate a border while someone input:focus please bro tell me please. If you need any details I will give you about my project.
But Please help me.
czcams.com/video/BMphVl9suxA/video.html i hope its helpful to you
When ur use border-radious -> this inside radious and outside radious NOT the same! but when ur using box-shadow it's just the shadow and it's not good look cause u have FAT Line.
Hello bro I need help you can help me ?? Please ans
Make a polyrhythm with dots it's moving infinite when it touches then music is play i watch a video it's awesome
Chanel Name :- Hypeplexed
Pls make a complete video on it ❓
Nevermind. I still doing it on Illustrator.
Im sure you canndo this with less css and another way.
Sir instead of music plz put ur voice
That’s the style of the videos 🤷♂ 😁
my english and communication skills are not good bro that's why i use music in my videos
bro, explain with some voice and code, music sucks
thank you for your work, cann you send me link of google. font. please, thank you !!