1. Using **flexbox** to vertically and horizontally center content is usually the preferred method for modern browsers.

In the container element, set ```display: flex``` and then center the child element vertically and horizontally using ```align-items: center``` and ```justify-content: center``` respectively.

2. If your content uses **grid**, you can follow the above instruction, but replace ```display: flex``` with ```display: grid``` to center the content.
 1. การใช้ **flexbox** เพื่อจัดเนื้อหาให้อยู่ตรงกลางในแนวตั้งและแนวนอนมักเป็นวิธีที่นิยมใช้สำหรับเบราว์เซอร์รุ่นใหม่ ในองค์ประกอบคอนเทนเนอร์ ให้ตั้งค่า ```display: flex``` จากนั้นจัดกึ่งกลางองค์ประกอบย่อยในแนวตั้งและแนวนอนโดยใช้ ```align-items: center``` และ ```justify-content: center''`` ตามลำดับ 2. หากเนื้อหาของคุณใช้ **ตาราง** คุณสามารถปฏิบัติตามคำแนะนำข้างต้นได้ แต่แทนที่ ```display: flex``` ด้วย ```display: grid``` เพื่อจัดกึ่งกลางเนื้อหา
spam fails_task lang_mismatch pii not_appropriate hate_speech sexual_content quality toxicity humor helpfulness creativity violence