hebrerillo
Coder
Hello there!
I want to center a grid item that has a max-width but the item is not centered. Here is a code example:
How can I center a grid item that has a max-width?
Thanks a lot in advance!
I want to center a grid item that has a max-width but the item is not centered. Here is a code example:
HTML:
<!DOCTYPE html>
<html>
<head>
<style>
.container {
display: grid;
grid-template-columns: 1fr;
height: 300px;
background-color: antiquewhite;
}
.item {
max-width: 1400px;
height: 50px;
border: 4px solid black;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="container">
<div class="item">
</div>
</div>
</body>
</html>
How can I center a grid item that has a max-width?
Thanks a lot in advance!