I’m attempting to make this card, with “Nouveau” on the leading ideal side.
Card I’m attempting to duplicate (Figma)
I attempted with placement: outright yet the message isn’t regularly on the leading right. With smaller sized displays it overruns and also leaves the card, and also with larger displays the message relocates in the direction of the centre of the picture.
<< area course=" home-restaurants">
<> < div course=" home-restaurants_card">
<> < img src=" assets/images/restaurants/ jay-wennington-N_Y88TWmGwA-unsplash. jpg">
<> < p course=" nouveau">> Nouveau< < div course=" home-restaurants_card-content">
<> < h3>> La combination du goût<.
<< p>> Ménilmontant<.
<.
<.
<.
home-restaurants.
background-color: #F 6F6F6.
&& _ card.
margin: 18px.
placement: family member.
img.
display screen: flex.
background-color: white.
border-radius: 15px 15px 0 0.
size: 100%.
elevation: 231px.
object-fit: cover.
&&- web content.
line-height: 5px.
cushioning: 5px 0 5px 15px.
background-color: white.
border-radius: 0 0 15px 15px
. nouveau.
display screen: flex.
justify-content: facility.
align-content: facility.
border-radius: 5px.
shade: # 008766.
background-color: # 99E2D0.
cushioning: 7px.
size: 80px.
