This is a solution to the QR code component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
- Solution URL: Repository
- Live Site URL: Web site test
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
Place the image inside the div and have the image inherit the rounded corners.
<div class="barcode">
<img src="./images/image-qr-code.png" />
</div>
.barcode {
width: 290px;
height: 290px;
border-radius: 10px;
overflow: hidden;
}
.barcode img {
max-width: 100%;
height: auto;
}
It is very important for me to keep practicing and learning.
- Resource 1 - It has information about the treatment of images with html.
- Website - Rafael Pampavilca
- Frontend Mentor - @rafopm