CSS is now a lot easier
All you need to do is use a few pre-defined classes, make minute changes and its done.
product.css takes care of the complex css codes so you can focus on the other parts of
your website.
Open Source
device_hub
product.css is an open source project. Any developer from the
world can contribute to it.
MIT LICENSE
security
The MIT license is a simple and permisive license originating at the
Massachusetts Institute of Technology. It allows every person to deal with the
software without any restrictions.
License
GitHub
product.css is maintained and developed on GitHub.
View on GitHub
Demo 1 - Navigation Bar
<link href="product.css" type="text/css" rel="stylesheet"> <nav class="p_nav"> <ul class="width-12"> <li class="width-3">Menu item</li> <li class="width-3">Menu item</li> <li class="width-3">Menu item</li> <li class="width-3">Menu item</li> </ul> </nav>
Demo 2 - Grid layout
<link href="product.css" type="text/css" rel="stylesheet"> <div class="p_part"> <div class="width-4"> <p> The class p_part sets the width to 100% and has a height of 500px, This class can be used to break website into parts or sections. </p> </div> <div class="width-4"> <p> Class width-4 divides the section into 3 equal parts. </p> </div> <div class="width-4"> <p> This grid is 1/3 of the total width. </p> </div> </div>
The class p_part sets the width to 100% and has a height of 500px; This class can be used to break website into parts or sections. In this demo p_part is given white background color to show the exact dimensions.You can change it as per your wish.
Class width-4 divides the section into 3 equal parts. They are given a red background for better understanding.
This grid is 1/3 of the total width.