reading-notes

           Welcome to Read: 04

Responsive Web Design and Regular Expressions

In this Read: 04, I will talk about this topic:

• CSS GRID.
  

CSS GRID
CSS Grid Layout, is a two-dimensional grid-based layout system that aims to do nothing less than completely change the way we design grid-based user interfaces. CSS has always been used to lay out our web pages, but it’s never done a very good job of it. First, we used tables, then floats, positioning and inline-block, but all of these methods were essentially hacks and left out a lot of important functionality.

• Grid Container
  

  • The element on which display: grid is applied. It’s the direct parent of all the grid items. In this example container is the grid container.
    

      <div class="container">
      <div class="item item-1"> </div>
      <div class="item item-2"> </div>
      <div class="item item-3"> </div>
      </div>    
    

• Grid Line
  

  • The dividing lines that make up the structure of the grid. They can be either vertical (“column grid lines”) or horizontal (“row grid lines”) and reside on either side of a row or column. Here the yellow line is an example of a column grid line.
    

    

• Grid Track
  

  • The space between two adjacent grid lines. You can think of them like the columns or rows of the grid. Here’s the grid track between the second and third row grid lines.
    

    

For further infromation please click here.

Read	Title	ToGo
Read: 01	SMACSS and Responsive Web Design
Read: 02	jQuery, Events, and The DOM
Read: 03	Flexbox and Templating
Read: 04	Responsive Web Design and Regular Expressions
Read: 05	Heroku Deployment
Read: 06	Node, Express, and APIs
Read: 07	APIs continued
Read: 08	SQL
Read: 09	Refactoring
Read: 10	The Call Stack and Debugging
Read: 11	EJS
Read: 12	Components
Read: 13	Update/Delete
Read: 14a	DB Normalization
Read: 15	Diversity and Inclusion