I need help with aligning the child divs within a parent div. I have 3 children that I want to display beside each other, except for the last div with "form-message" class, which should be in a new line but to the right, under the div with "form-field" class. Can someone guide me on how to achieve this layout?
.form-row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.form-row .form-label {
width: 35%;
}
.form-row .form-field {
width: 65%;
}
<div class="form-row">
<label class="form-label">Your message</label>
<div class="form-field">
<textarea name="message"></textarea>
</div>
<div class="form-message">
<p>You can write your message here</p>
</div>
</div>