CSS Grid. Responsive CSS Grid, built for web and mobile.
CSS Grid is a valid HTML5, responsive CSS Grid from 1 to 8 columns. It works on iPhone, iPad, Google Android and Windows 8.
Why is this different to other CSS grids?
There are many grids out there already, but after working on several responsive websites, I found most of them to be quite complex for beginners, so I developed this simple solution where developers at all levels would be able to use it. Read below to see how easy it is to use!
Features
- Works on: iPad, iPhone, HTC, Nokia, Samsung, Sony, LG, Blackerry
- Fixed or Percentage Columns (or mix them)
- 1 to 8 columns
- Easy HTML Setup
- Use Stack Class to automatically stack columns
- With or without column padding
- Detailed Instructions
- PSD files included for 1024, 768, 480, 320
Tested and compatible with:
- iOS 5+
- Android 2.5+
- Safari 5+
- Chrome 27.0+
- IE 8, 9, 10+
- Windows 8 (IE 10)
Changing columns from fixed to percentage
You can change a column from fixed width to percentage width by changing f to p.
It really is that easy!
Stacking Columns (New! Added 13 Sept 2013)
In some cases, content can become a little squashed on mobile portrait as the space is quite narrow. if this is the case, you may need to stack the columns on top of each other. All you need to do is add stack to the DIV, and it will automatically stack the columns on top of each other.
Javascript Toggle Navigation for Mobile
When a screen width becomes too narrow to fit all the navigation, an alternative is required. This download includes the Javascript Toggle Navigation for FREE, so you can use this for hiding and displaying the navigation buttons.
Does this have Instructions?
Sure does. This download comes with some detailed instructions on using the grid, css structure and understanding responsive grids.
Need some help?
Feel free to get in touch if you have any questions and I will get back to you as soon as possible.
------------------------------------------------------------------------
v 1.2 (13 September 2013)
* Toggle Nav, simplified code
* Toggle Nav, changed to stack on top instead of overlapping content
* Stack CSS added, allowing easy option to stack DIVs for narrow width
------------------------------------------------------------------------
v 1.1 (11 July 2013)
* Toggle Nav Added for narrow widths
------------------------------------------------------------------------
v 1.0 (14 June 2013)
* Released
------------------------------------------------------------------------
This Responsive CSS Grid was developed by cssgrid.co.
Available exclusively at CodeCanyon from Envato.
0 komentar:
Posting Komentar