Overview
CSS has changed substantially over the years. CSS Grid Layout is a two-dimensional grid layout system that allows developers to format web content into unique layouts.
This instructor-led, live training (online or onsite) is aimed at developers who wish to use CSS Grid Layout to architect flexible and responsive grid layouts that were previously difficult to do with legacy CSS layout features such as floats and Flexbox.
By the end of this training, participants will be able to:
- Set up the necessary development environment to start styling a web application.
- Use CSS Values to avoid rudimentary tasks, making coding easier.
- Arrange web content into different layouts and styles.
- Code, package, and test the CSS code.
Format of the Course
- Interactive lecture and discussion.
- Lots of exercises and practice.
- Hands-on implementation in a live-lab environment.
Course Customization Options
- To request a customized training for this course, please contact us to arrange.
Requirements
- CSS programming experience
Audience
- Developers
Course Outline
Introduction
- The Growth of Web Styling
The Web Gridding Process
- Streamlining grid designs
- Processes and tools used for creating a web application layout
- Coding, building, testing, and deploying
Preparing the Development Environment
- Editors and/or IDEs (Integrated Development Enviroment)
- Prepare the code repository (Github, GitLab, etc.)
Designing Grids for Your Web Application
- Utilizing CSS values to define parent and child properties
- Establishing a new grid formatting context for the grid’s content
- Managing items by grid areas and names
- Spanning items across rows and columns
- Controlling the auto-placement algorithm for easy updates
Testing the Application
- Refreshing the browser after code changes
Deploying the Application
Troubleshooting
Summary and Conclusion