Welcome to our channel for web design using HTML, CSS, and Javascript.
You can find a wide range of in-depth tutorials here that cover everything from fundamental concepts in HTML, CSS, and Javascript to more sophisticated web development strategies. Our videos are made to assist developers of all levels in honing their craft and building stunning, flexible websites.
background-position: center; background-size: cover; background-repeat: no-repeat; These three property in your div will be cherry on top , and makes the center position will be always seen even if it is closed and transition will also look stunning . ( love your work )
The checked one is the default card that is open on page load. As I was copying the inputs in the beginning, I forgot to remove the checked attributes from the other inputs (it made no sense to check all because only one of them can be checked at any time)
i'm still trying to figuring out why does the "navigation" class doesn't work to me. I've working on the same code for 3 days until now. This is like my 14 time trying to make the navigation class work on my css :(
That's a creative way to get these card effect, nice! :) Sadly it's not accessible and also not W3C compliant (div in label), so I would never implement it like this.
Thanks for this wonderful tutorial. I have one small question: How could I keep the H1 text while hovering it and position span text to the right hand side? I'm working on my own project and I think it would be cool if both available at a same time (of course images should be removed to have more space). Thanks for you help!
Thank you! Of course, here are some small adjustments you could make: 1. Remove the images div 2. add the following css: .text { display: flex; justify-content: space-between; } 3. delete the position, width and height attributes in ".text span" css selector
It makes it easier to differentiate which .exemple2 elements you want to address, especially if you use .exemple2 multiple times throughout the document. This representation only addresses .exemple2 elements located in .exemple1 elements
I'm a little confused by 2 things: how come you don't need to define a width on the icon so that it's always a circle (as opposed to some other shape). How come when you put the styles for the text, they disappeared? I don't think overflow hidden should make them disappear?
Can this land me a front end job if i know this + make a few beautiful websites with different animations like this etc? Also do i need to know this from scratch or does every developer search everything from the web? I can create a website but i feel like i am taking 99% from different resources, like a puzzle game. Am i doing this correctly??
Hey yeah that's normal that's how I worked some time ago. But with every project you do you learn and memorize additional things. For a job the result is more important but having to search things up might take longer for the projects to finish. Try to learn from scratch and you'll be able to recreate what's on your mind without the need to do excessive research
Too much learning, development is such a broad field i don't feel like learning everything from scratch. I feel like excessive research is more fun but idk. Maybe IT is not for me. I am currently in an internship as a web developer ( super easy project ) at a vocational school, but i am soon graduating and i will apply myself to university of applied sciences, but idk if i want to take IT major this time. Thanks for the reply =) @@webuitutorials
