Category: CSS

CSS Dropdown Menu Tutorial Font-Awesome Icons

Create Pure CSS Dropdown Menu can also be made look beautiful and attractive with the use of CSS. But in this CSS Dropdown Menu Tutorial we will focus mainly on the use of Font-Awesome Icons to create a drop down menu. We will use CSS animation in this tutorial to a better effect. This dropdown

Difference between OVERFLOW and TEXT-OVERFLOW

Overflow and text-overflow both are different property and yet they are used to hide text inside the container with different uses. Overflow: Overflow property clip the text inside the defined dimension and hide rest outside of the area. If we set the height and width of the container as 200px and the content inside the

CSS3 Box Shadow

Box shadow property is used to create shadow effects with CSS. The same thing previously done on Image it was tricky to use in html. The box-shadow property effect can be applied on one or more elements by a comma-separated list. The box-shadow property can have 2-6 options, the main options are horizontal offset and

Clipping and Masking in CSS

Clipping and masking is used to hide some portions of an element in CSS. Whoever does Photoshop work, know about masking, is easily done. But If you do not know masking in Photoshop, you can easily achieve this using clipping and masking property of CSS. But there are some differences between those two. The clipping

Div Vertical Alignment middle inside a div

How an element is vertically aligned inside a div? There are many ways to align any element or text vertically aligned inside a div container. If we have a fixed sized container and certain text length, we can easily align it with the help of padding or positioning property of CSS. But what if the

Transition and Animation in CSS

How do we create animation using css properties? CSS3 has amazing features and that transitions and animations are one of them that bring life to web applications. Adding motion to you web application brings lots of attention and make application look charming. Transition is the property that tells element to animate when it changes and

Multiple Border in CSS

Many beginners do not know how to do multiple borders around any object in CSS, but there are ways to do it. I will show the way to do it by simply using border property and using some pseudo elements (:after and :before). If you want to create more borders around any object, you also