How to move a container inside of another container in Bootstrap 5 ? Last Updated : 21 Nov, 2023 Summarize Comments Improve Suggest changes Share Like Article Like Report The container is used to set the content’s margin. It contains row elements and the row elements are containers of columns. This is known as the grid system. In this article, we will learn about How to move a container inside of another container in Bootstrap 5. We will move a container to the left in another container. Syntaxms-0 me-0 Table of Content Using ms-0 classUsing me-0 classUsing ms-0 classAdd a container inside another container on the left using class ms-0.This class is used to set the left-margin to zero.Hence, it will set the left margin of the inner container to 0.That is how we can add a container inside another on the left. Example: This example illustrates the placing of one container inside of another container in Bootstrap 5. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href= "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div> <div class="container mt-1"> <h2 class="text-success"> GeeksforGeeks </h2> <h2> How to move a container inside of another container in Bootstrap 5? </h2> </div> <div class="container bg-success"> <div class="container ms-0 bg-warning w-50"> <input type="checkbox"> Java </div> </div> </div> </body> </html> Output: Using me-0 classAdd a container inside another container on the right using me-0.This class is used to set right-margin to zero.Hence, it will set the right margin of the inner container to 0.That is how we can add a container inside another on the right. Example: This is another example that illustrates the placing of one container inside of another container in Bootstrap 5. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href= "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div> <div class="container mt-1"> <h2 class="text-success"> GeeksforGeeks </h2> <h2> How to move a container inside of another container in Bootstrap 5? </h2> </div> <div class="container bg-success"> <div class="container me-0 bg-warning w-50"> <input type="checkbox"> Java </div> </div> </div> </body> </html> Output: Comment More infoAdvertise with us Next Article How to move a container inside of another container in Bootstrap 5 ? N nikitamehrotra99 Follow Improve Article Tags : Web Technologies Bootstrap Geeks Premier League Bootstrap-Questions Bootstrap-5 Geeks Premier League 2023 +2 More Similar Reads How to Add a Border to a Container in Bootstrap ? Borders in Bootstrap are a styling element used to enhance the visual appearance of containers, buttons, and other elements. They can be customized with various colors, thicknesses, and styles to create distinct visual effects. Below are the approaches to add a border to a container in Bootstrap: Ta 3 min read Bootstrap 5 Containers Responsive Containers Bootstrap 5 Containers Responsive containers are used to group HTML elements and also provide support for grid layout. It has in-built responsiveness which is helpful while development. Bootstrap 5 Responsive Container Classes:container-sm: Container small is a class that styles a container that has 3 min read Bootstrap 5 Containers Default Container Containers are the most fundamental layout component in Bootstrap, which is necessary if you want to use the pre-installed grid system. The purpose of containers is to hold, center(at times), and occasionally add some padding to the content they hold. Although containers can be nested, most layouts 2 min read What is the Difference Between container and container-fluid in Bootstrap 5 ? In Bootstrap 5, the "container" class creates a responsive container with a fixed width, adjusting to different screen sizes while maintaining margins. On the other hand, the "container-fluid" class generates a full-width container that spans the entire viewport without any margins, providing a seam 3 min read How to stretch flexbox to fill the entire container in Bootstrap? We are given an HTML document (linked with Bootstrap) with a flexbox and a container. The goal is to stretch the flexbox to fill the entire container. Table of Content Using Bootstrap flex-fill classUsing Bootstrap's flex-grow ClassUsing Bootstrap flex-fill classThe .flex-fill class stretches the wi 3 min read Like