tailwindcss/docs/source/docs/container.blade.md

extends	title	description
_layouts.documentation	Container	A component for fixing an element's width to the current breakpoint.

@include('_partials.work-in-progress')

Class	Breakpoint	Properties
.container	None	width: 100%;
	sm (576px)	max-width: 576px;
	md (768px)	max-width: 768px;
	lg (992px)	max-width: 992px;
	xl (1200px)	max-width: 1200px;

Tailwind's .container class sets the max-width of an element to match the min-width of the current breakpoint.

Note that unlike containers you might have used in other frameworks, Tailwind's container does not center itself automatically and does not contain any built-in horizontal padding.

To center a container, use the .mx-auto utility:

<div class="container mx-auto">
  <!-- ... -->
</div>

To add horizontal padding, use the .px-{size} utilities:

<div class="container mx-auto px-4">
  <!-- ... -->
</div>