Container Vs Container-fluid classes in Bootstrap | Web Designing

Container Vs Container-fluid classes in Bootstrap | Web Designing

.container and .container-fluid are two CSS classes used in Bootstrap framework for creating responsive containers.

A .container class creates a fixed-width container, whereas a .container-fluid class creates a full-width container that spans the entire width of the viewport.

For example, if you use a .container class with a specified width of, say, 1170 pixels, the container will have a maximum width of 1170 pixels and will be centered on the page. On smaller screens, such as those of mobile devices, the container will be scaled down and its contents will be rearranged to fit the available screen space.

On the other hand, if you use a .container-fluid class, the container will always span the full width of the viewport and will not have a maximum width. This makes it useful for creating full-width elements such as headers and footers that need to take up the full width of the screen.

In summary, you should use the .container class when you need a fixed-width container, and the .container-fluid class when you need a full-width container that spans the entire width of the viewport.

**********************************************
Videos Links:
Container Vs Container-fluid classes in Bootstrap | Web Designing
https://www.youtube.com/watch?v=-FhNUCY6Bxg

Connecting Bootstrap to HTML | Web Designing
https://www.youtube.com/watch?v=geZfkwts7JU

Bootstrap tutorial | Overview | What is Bootstrap? | Web Designing
https://www.youtube.com/watch?v=XDjUV8tBiew

Form | HTML CSS | Lesson# 13 | Web Designing | Lecture# 9
https://youtu.be/n1SzpfQct-Q

Web Layout | HTML CSS | Lesson# 12 | Web Designing | Lecture# 8
https://youtu.be/xHs1Jacrytg

Gradient in CSS | Lesson# 11 | Web Designing | Lecture# 7
https://youtu.be/dC7L9YmJr54

Navigation in CSS | Lesson# 10 | Web Designing | Lecture# 7
https://youtu.be/hLvzEN20-Nk

Borders in CSS | Lesson# 9 | Web Designing | Lecture# 6
https://youtu.be/YZKGr7nRSjE

Background in CSS | Lesson# 8 | Web Designing | Lecture# 6
https://youtu.be/yLYnJEw3hqY

ID & Class Selectors in CSS | Lesson# 7 | Web Designing | Lecture# 5
https://youtu.be/qe6nWyMbRB4

Element Selector in CSS | Lesson# 6 | Web Designing | Lecture# 5
https://youtu.be/crBP3JDti7I

Borders, Margin & Padding in CSS | Lesson# 5 | Web Designing | Lecture# 5
https://youtu.be/kWvIbRQ3Jc4

External CSS | Lesson# 4 | Web Designing | Lecture# 5
https://youtu.be/tcZjmahL32w

Internal CSS | Lesson# 3 | Web Designing | Lecture# 5
https://youtu.be/xjvACEFOh-o

Inline CSS | Lesson# 2 | Web Designing | Lecture# 5
https://youtu.be/PAYnLdq9iT8

Introduction to CSS | Lesson# 1 | Lecture# 5 | Cascading Style Sheet
https://youtu.be/WaGpCZBWXLE

Lesson# 10 | Web Designing | HTML Multimedia | Lecture# 4
https://youtu.be/VmUFnALWRdQ

Lesson# 9 | Web Designing | HTML Lists | Lecture# 3
https://youtu.be/9kBMj-YVFvA

Lesson# 8 | Web Designing | HTML | Lecture# 3
https://youtu.be/RwOpIGIIASE

Lesson# 7 | Web Designing | HTML | Lecture# 3
https://youtu.be/vN0gqBPEna0

Lesson# 6 | Web Designing | HTML | Lecture# 3
https://youtu.be/5OXtOeCAuMs

Lesson# 5 | Web Designing | HTML | Lecture# 3
https://youtu.be/0S58KvZzCo8

Lesson# 4 | Web Designing | HTML | Lecture# 3
https://youtu.be/t1nSQE49J98

Lesson# 3 | Web Designing | HTML | Lecture# 3
https://youtu.be/5LExBBixvdg

Lesson# 2 | Web Designing | HTML | Lecture# 3
https://www.youtube.com/watch?v=T5KkrmtHglc

Lesson# 1 | Web Designing | HTML | Lecture# 3
https://www.youtube.com/watch?v=vkHIqDWqJLg

Who can become a Web Designer
https://www.youtube.com/watch?v=tmY6b8PnkfM

How to download and install Brackets
https://www.youtube.com/watch?v=Gf2oGAXjg7o

All About Web Designer VS Web Developer Lecture# 2
https://www.youtube.com/watch?v=uiePwoda5Ok

Discover the Basics of Web Designing | Lecture# 1
https://www.youtube.com/watch?v=JhVyXZINMS8

Discover the Basics of Web Designing ! | Lecture# 1
https://www.youtube.com/watch?v=JhVyXZINMS8