27 lines
1.1 KiB
CSS
27 lines
1.1 KiB
CSS
.centered-container {
|
|
display: flex; /* Use Flexbox for centering */
|
|
justify-content: center; /* Center horizontally */
|
|
align-items: center; /* Center vertically */
|
|
/* height: 100vh; Full height of the viewport */
|
|
width: 100%; /* Full width of the viewport */
|
|
overflow-x: auto; /* Enables horizontal scrolling if necessary */
|
|
margin: 20px 0; /* Spacing above and below the container */
|
|
background-color: rgba(0, 42, 255, 0.6);
|
|
border-radius: 20px;
|
|
}
|
|
|
|
.inner-container {
|
|
width: 80%; /* Set inner container width to 80% */
|
|
max-width: 1000px; /* Optional: limit maximum width */
|
|
box-sizing: border-box; /* Include padding/borders in width calculation */
|
|
padding: 20px; /* Padding for inner content */
|
|
text-align: center; /* Center text inside the inner container */
|
|
}
|
|
|
|
/* Media query for responsive design */
|
|
@media (max-width: 768px) {
|
|
.inner-container {
|
|
width: 100%; /* Set inner container width to 100% on mobile */
|
|
}
|
|
}
|