Html Css Konumlandırma Hakkında

Merhaba kodları yazarken aşırı problem yaşamıyorum ancak sayfa düzeni oluşturmakta berbatım yaptığım şeyleri konumlandırmakta pek iyi değilim ekranda resim koyduğum zaman mor alanın dışına çıkmıyor ama yazılar çıkıyor bunu nasıl düzeltirim

Merhabalar;

Kelimelerin css kısmını kodlarken;
Örneğin;


.yazilar {
width: 11px;
background-color: lightblue;
border: 2px solid black;
padding: 10px;
font-size: 20px;
}

gibi kısımların arasına;

word-wrap: break-word;

eklemek probleminizi çözecektir.

Konu adına; css word wrap olarak aratabilir ve örnekler görebilirsiniz

Örnek: https://www.javatpoint.com/css-word-wrap

Ama bu konuda en iyi ve en doğru kaynak: https://www.w3schools.com/ adresidir.

çok teşekkürler hem sorunum çözüldü hem de bilgi alabileceğim bir yer buldum.

Rica ederim, Keyifli ve Mutlu forumlar dilerim