@RJ3605
Posted
Hi yungfora,
I made an earlier post, but I misunderstood your question. I see that your prices are within a <p> tag. I would recommend changing that to a <div> as <p> tags are specifically meant to wrap text. Then add a <span> around the "$149.99". After, add classes to both <span> elements to modify the appearance in CSS instead of applying that to the <p>:last-of-type and <span>:last-of-type. From there you can make the <div> holding the two spans have the CSS 'display: flex;' and ' align-items: center;' properties. It would look something like the following.
HTML:
<div class="prices"><span class="new">$149.99</span>
<span class="old">$169.99</span>
</div>CSS:
.prices {
display: flex;
align-items: center;
}
That should cause the two <span> elements to center vertically.
Feel free to reach out if you have any further questions. Happy Coding!
Marked as helpful
