This is a solution to the Order summary card challenge on Frontend Mentor
Users should be able to:
- See hover states for interactive elements
- Solution URL: FrontEnd Mentor: My Solution
- Live Site URL: GitHub Page: Order Summary
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
I could not get the background picture to stay in its place. And then I learned of the "background-size" property
body {
font-family: 'Red Hat Display', sans-serif;
font-size: 16px;
background-image: url(images/pattern-background-desktop.svg);
background-color: var(--pale-blue);
background-repeat: no-repeat;
background-size: contain; !!!!!!!!!!!!!!!!!!
}I tried being better than my last project on organizing my HTML, however I aim to perfect it. I want to start integrating a better template layout, such as
<body>
<header></header>
<nav></nav>
<main>
<section></section>
<article></article>
<aside></aside>
</main>
<footer></footer>
</body>- Image Color Picker - I love using this site to pick a color out from a screenshot.
- Website - Anosha Ahmed - This is my website. There's nothing there at the moment but in the future there will.
- Frontend Mentor - @anoshaahmed
- GitHub - @anoshaahmed
- Twitter - @anosha1ahmed