Pure.CSS Tutorial

Input Sizing Form You can specify input elements in the form having fluid width size. It is similar to pure-grid. You have…

Pure.CSS Menus Pure.CSS provides vertical menus by default. It is very easy to customize the menus in Pure.CSS because of minimal styling…

Multi-Column Forms The class name pure-grid is used to create a responsive multi-column form. It requires that pure responsive grid to be…

Pure.CSS Read Only Inputs The “readonly” attribute is used to make a form input read only. The difference between disabled and readonly…

Pure.CSS Required Inputs The “required” attribute is used to mark a form control as required. Example: If your form needs an email…

Pure.CSS Responsive Design Pure.CSS uses the following classes to create a responsive design. Index Class Name Description 1) .pure-u-* It is used…

Pure.CSS Rounded Inputs The “pure-input-rounded” classname is used to display a form control with rounded corners. It is generally used for search…

Pure.CSS Stacked Form The class name “pure-form-stacked” is used to create a stacked form with input elements below the labels. The “pure-form-stacked”…

Pure.CSS Stripped Tables If the table is large, it would better to make it stripped. The stripped table is more visible and…

Tables with Horizontal Borders If you want only horizontal lines in your table, add the pure-table-horizontal classname to the <table> element. It…