* {
margin: 0;
padding: 0;
}
#principal {
background: skyblue;
/*display: flex;
flex-direction: column;*/
}
#principal #contenedor-1 .column ul {
list-style: none;
}
#principal #contenedor-1 {
border: 1px solid navy;
width: 800px;
margin: 0 auto;
display: flex;
justify-content: space-evenly;
}
#principal #contenedor-2 {
background: skyblue;
display: flex;
justify-content: center;
}
#principal #contenedor-2 div {
border: 2px solid navy;
width: 800px;
}
/* Añadido a tu código */
#principal #contenedor-1 ,
#principal #contenedor-2 {
max-width: 100%;
}
<div id="principal">
<div id="contenedor-1">
<div class="column">
<span>Título 1</span>
<ul>
<li>Item 1 Item 1</li>
<li>Item 1 Item 1</li>
<li>Item 1 Item 1</li>
<li>Item 1 Item 1</li>
<li>Item 1 Item 1</li>
</ul>
</div>
<div class="column">
<span>Título 2</span>
<ul>
<li>Item 2 Item 2</li>
<li>Item 2 Item 2</li>
<li>Item 2 Item 2</li>
<li>Item 2 Item 2</li>
<li>Item 2 Item 2</li>
</ul>
</div>
<div class="column">
<span>Título 3</span>
<ul>
<li>Item 3 Item 3</li>
<li>Item 3 Item 3</li>
<li>Item 3 Item 3</li>
<li>Item 3 Item 3</li>
<li>Item 3 Item 3</li>
</ul>
</div>
</div>
<div id="contenedor-2">
<div>
<p>Texto Texto Texto Texto Texto Texto Texto</p>
</div>
</div>
</div>