<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>text_flex_centered_text_node_vs_nested_container</title>
<link rel="stylesheet" href="../shared.css" />
</head>
<body style="width: 1200px; height: 630px">
<div
style="
display: flex;
width: 100%;
height: 100%;
background-color: rgb(0, 0, 0);
align-items: center;
justify-content: center;
"
>
<div
style="
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: rgb(255, 255, 255);
"
>
<span
style="
display: flex;
width: 300px;
height: 200px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 30px;
margin-left: 0px;
background-color: rgb(59, 130, 246);
align-items: center;
justify-content: center;
font-size: 30px;
"
>centered...?</span
>
<div
style="
display: flex;
width: 300px;
height: 200px;
background-color: rgb(171, 130, 246);
align-items: center;
justify-content: center;
font-size: 30px;
"
>
<span>centered</span>
</div>
</div>
</div>
</body>
</html>