div.post.reply { width: 320px; height: 480px; background-color: #c0a16b; border: 5px solid #b68d38; padding: 10px 10px 30px 0px; box-sizing: border-box; margin: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); font-family: 'Roboto', sans-serif; display: flex; flex-direction: column; overflow: hidden; } label { font-size: 18px; font-weight: bold; color: #000; padding-bottom: 5px; border-bottom: 2px solid #b68d38; flex: 0 0 20px; } time { font-size: 12px; color: #444; margin-top: 5px; border-bottom: 2px solid #b68d38; padding-bottom: 5px; } div.files { text-align: center; margin: 10px 10px 5px 17px; padding: 10px 0px 0px 45px; flex: 1; overflow: auto; border: 3px solid #b68d38; } div.files img { max-width: 100%; } div.body { line-height: 1.5; color: #000; background-color: #e2dfd3; border: 2px solid #b68d38; padding: 10px 7px 7px 12px; text-align: justify; flex: 1; overflow: auto; } a.post_no { font-size: 10px; color: #000; text-align: center; padding-top: 5px; flex: 0 0 30px; } .thread { display: grid; grid-template-columns: repeat(10, .1fr); grid-gap: 1px; justify-items: left; padding: 5px; } div.post.op { grid-column: 1 / -1; /* Span from the first column to the last */ width: 100%; /* Use full width available in grid */ height: auto; /* Let height adjust automatically based on content */ background-color: #c0a16b; border: 5px solid #b68d38; padding: 10px; /* Consistent padding */ box-sizing: border-box; margin: 10px 0; /* Vertical margin only */ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); font-family: 'Roboto', sans-serif; display: flex; flex-direction: column; overflow: hidden; }