Alt Text Here you can find the live version Now let’s see how you can build one. We’ll start like always with HTML For our text input we first need to create a container: In this container we are going to have as first child a text input, a label and then a div which will be used to add that nice…
Alt Text If you’ve seen the above transition and you liked it then it’s time to move on and see how it’s built. It’s pretty easy to build something like that using only HTML and CSS, so let’s get ready: We’ll start as always with HTML part: First we’ll start off by adding a container for our image…
CSS Scan or how you can easily copy any css by the speed of light Get it here. What is CSS Scan? Just as the name suggest, it’s an tool which can be used to copy CSS from other websites so you don’t need to open the inspector to learn how something it’s actually coded. Just click and element and…
Fixed bar with animated social icons Have you ever wondered how some of the websites that you visit have a fixed bar with social icons on the left of the page and it just sits there? Have no fear because this post will cover that! How to make an element fixed: .div{ position: fixed; } Done! Yes, is…
CSS Animations When building a css animation you’ll need to know to essential keywords: @keyframes animation The first one is used to define how an animation behaves over time and the second one is used to reference the keyframes that we create. Let’s assume that we have a box and we need to shift…
How to create centered and responsive FlexBox items The Flexbox layout gives you great power when it comes to aligning items horizontally and vertically in a container. If you’ve used float’s before, you know that they only allow items to flow horizontally to right or to left. How to center items…
What is em measurement unit? I assume you already know the basics of CSS and what ems measurement unit means because this post will cover just the differences between ems and rems. Let’s get started… When it comes to using font-size property in CSS some of the most common used are pixels and ems but…