Tag html

Pure CSS Notification Bars

In today’s tutorial we’re going to take a look at the creation of some pure css notification bars. If you browse the internet on daily bases, which I know you do, I’m sure you’ve saw these notification bars on many…

Website Builder for Developers: The Slides Framework App

Promotional websites and landing pages key in the conversion of visitors into clients and users. A high-quality design can be a cornerstone to the improvement of sales figures and take your products into a Centre-stage. Slides Framework is a sequence…

Pure CSS Dropdown Menu with FontAwesome Icons

In a previous article, I’ve showed you how to make Pure CSS Dropdown Menu. And one of our readers suggested that we add CSS Transitions to it. But I’ve decided not to add it to that tutorial, Instead I’m making a…

Diamond Grid Style with CSS and HTML

Diamond Grid
Today I want to show you a really neat CSS grid style, called the diamond grid. I saw a tutorial for this first on 1stwebdesigner by Sam Norton. While I followed his tutorial, I noticed that he’s using an unordered list to achieve…

Data Table with Collapsible Table Rows

Data Table with Collapsible Table Rows
In today’s tutorial we’re going to take a look at an experiment I’ve been working on in the past few days. The basic idea is to have a html data table, that has multiple section, ( group or rows )…

How to Create Responsive Pure CSS Tabs

In this tutorial I’m going to show you how to create Responsive Pure CSS Tabs. We’ll be using Font-Awesome to add icons to the tab labels, so we can hide the text label and leave only the icons on smaller…

30 CSS Drawings Made with A Single Div

We all know how powerful CSS is, and that many amazing things can be done with, such as navigation menus, accordions and more. But there’s something else as well, drawings. Lynn Fisher, a web designer from Chandler created an amazing CSS…

Pure CSS Off Canvas Navigation Menu

In today’s tutorial, we’re going to take a look at the creation of a CSS off canvas navigation menu. First off, what is an off-canvas navigation menu. It’s a menu that is hidden/pushed aside from the screen, so it’s not…