4
จัด DIV ให้อยู่กึ่งกลางโดยใช้ CSS
ฉันอยู่ตรงกลาง DIV ในอีก DIV โดยใช้ flexbox นึกถึงหน้าต่างข้อความที่ปรากฏขึ้นตรงกลางหน้าจอเมื่อจำเป็น มันใช้งานได้ดี แต่มันจะดูดีขึ้นมากถ้าพื้นที่ด้านบนและด้านล่างของกล่องโต้ตอบไม่เท่ากันโดยมี 40% ของพื้นที่ที่เหลืออยู่ด้านบนและด้านล่างของกล่องโต้ตอบ 60% มันซับซ้อนมากเนื่องจากความสูงของกล่องโต้ตอบจะแตกต่างกันไปตามจำนวนข้อความภายใน ตัวอย่างเช่นหากความสูงของเบราว์เซอร์คือ 1,000 px และความสูงของหน้าต่างข้อความโต้ตอบคือ 400 px ฉันต้องการพื้นที่แนวตั้งที่เหลือ (600 px) เป็น 240 px ด้านบนและด้านล่างกล่องโต้ตอบ 360 px ฉันสามารถใช้ Javascript ได้ แต่ฉันอยากรู้ว่า CSS มีวิธีที่ชาญฉลาดหรือไม่ ฉันพยายามเพิ่มระยะขอบด้านล่างลงใน #dialogBox DIV แต่ไม่ได้ผลเมื่อความสูงของกล่องโต้ตอบใกล้กับความสูงของเบราว์เซอร์ #dialogBoxPanel { position:absolute; display:flex; align-items:center; justify-content:center; left:0px; top:0px; width:100%; height:100%; } #dialogBox …