Naomi Pham• 180
@naomi-pham
Posted
Hi, great job on the responsive design! However, I noticed that your component <div id="read"> has a margin-left of 10px which makes it unaligned with the title on the mobile screen. I think you can fix it by placing your h1 and <div id="read"> inside a flexbox with a gap value:
<div class="feature">
<h1></h1>
<div id="read"></div>
</div>
.feature {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
On mobile screen, you can add flex-direction: row so it would align horizontally.
Marked as helpful
0
