// tailwind container css
.container {
width: 100%;
display: inline-block;
margin: 0 auto;
transition: width .1s;
}
@media (min-width: 640px) {
.container {
width: 640px;
}
}
@media (min-width: 768px) {
.container {
width: 768px;
}
}
@media (min-width: 1024px) {
.container {
width: 1024px;
}
}
@media (min-width: 1280px) {
.container {
width: 1280px;
}
}
@media (min-width: 1536px) {
.container {
width: 1536px;
}
}
Use %.
% takes the x% space of the parent element.
example:
This div will have the same width as the body, which is usually the whole page.
<style>
div{
width:100%;
}
</style>
<body>
<div></div>
</body>