In the Ionic grid, there are three types of components. The first is ion-grid, the second is ion-row, and the third is ion-col. ion-grid acts as a container for ion-row and ion-col. It takes the full width of the parent. ion-row is for creating rows in the grid. It takes the full width of ion-grid. ion-col is used to create a column inside ion-row. As I said in the chapter earlier, it is a 12-column grid. So, you can have a maximum of twelve columns in a row, without having a line break.
Now, let's understand how we structured our example.
Our home.html page is a kind of profile page for a dummy social network site. We have an avatar of the user, their location, name, various contact icons, and then the social feed.
This is ...
