<section>
<h1>Main title</h1>
<p>Dragée powder bear claw tiramisu pudding gummi bears wafer. Macaroon chocolate cake cake marzipan icing carrot cake macaroon sweet. Lemon drops </p>
</section>
<section>
<h2>Secondary title</h2>
<p class="full-background">Pie pastry macaroon candy tootsie roll jujubes pudding pie. Jelly-o chocolate cake pastry gingerbread brownie danish liquorice chocolate cake. Jelly beans donut cupcake danish croissant liquorice. Cotton candy brownie croissant pie toffee. Cotton candy chocolate cake gummi bears ice cream jelly fruitcake caramels. Shortbread ice cream bear claw gingerbread chocolate cake jelly-o cake caramels soufflé.</p>
</section>
<section>
<h3>another title</h3>
<p>Pie pastry macaroon candy tootsie roll jujubes pudding pie.</p>
</section>
.full-background {
border-image: conic-gradient(pink 0 0) fill 0//0 100vw;
padding-block: 10px;
}
section {
/* center + max-width:800px + min-margin: 10px */
margin-inline: max(10px, 50% - 800px/2);
margin-block: 50px;
}
body {
font-family: system-ui, sans-serif;
background: #eee;
}
h1 {
font-size: 3rem;
}
p {
font-size: 1.5rem;
text-align:justify;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.