<div class="container">
Inline element (text) to be horizontally centered
</div>
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
:root {
--const-color-black: #000000;
--const-color-white: #FFFFFF;
--color-header: #D9A443;
--color-main-background: #F9F6F1;
--color-link: #375F9B;
}
body {
font-family: 'Open Sans', sans-serif;
color: var(--const-color-black);
}
* {
box-sizing: border-box;
}
.container {
background-color: var(--color-main-background);
border: 1px solid var(--color-link);
margin: 1.0rem auto;
padding: 1.0rem 0;
width: 100%;
/* Horizontally center inline child elements */
text-align: center;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.