Home Page Home Contact About Welcome to my (about me) site HI there this is one of my favorite songs down below. Author: Josiah McSweeney Copyright Reserved
<!DOCTYPE html>
<html>
<head>
<title>Home Page</title>
<link rel="stylesheet" href=".css">
<link rel="stylesheet" href=".css">
<link rel="stylesheet" href=".css">
</head>
<body>
<!--Added main tag-->
<main>
<!--Added nav tag-->
<nav>
<a href="index.html">Home</a>
<a href="contact.html">Contact</a>
<a href="about.html">About</a>
</nav>
<h1>Welcome to my (about me) site</h1>
<picture>
<source media="(min-width:650px)" srcset="./images/me3-650.jpg">
<source media="(min-width:465px)" srcset="./images/me3-465.jpg">
<img src="./images/me3.JPG" alt="ME" style="width:auto;">
</picture>
<h3>HI there this is one of my favorite songs down below.</h3>
<iframe width="420" height="345"
src="https://www.bing.com/search?q=Nirvana%20-%20The%20Man%20Who%20Sold%20The %20World&pc=0TTE&ptag=C1N2A04173C0C08&form=CONBNT&conlogo=CT3210127&shtp=GetUrl&shid=38702244-8c35-477e-a042- 805b2b2d81bc&shtk=TmlydmFuYSAtIFRoZSBNYW4gV2hvIFNvbGQgVGhlIFdvcmxkIChNVFYgVW5wbHVnZ2VkKQ%3D %3D&shdk=UkVNQVNURVJFRCBJTiBIRCEgVGFrZW4gZnJvbSB0aGUgMjV0aCBBbm5pdmVyc2FyeSBFZGl0aW9ucyBvZiBOaXJ2YW5hIGI%3D&shhk=7xVtP%2FaZHQw%2B31lGYV%2F3cJukwLOZgUcFMDTYwdmuLsA %3D&shth=OVP.2ZxeDKLNemtX7dQ99X3ETQHgFo">
</iframe>
<footer>
<div class="foot">
<p>Author: Josiah McSweeney<br>
<p>Copyright Reserved</p>
</div>
</footer>
</main>
</body>
</html>
![There must be at least one Grid layout and one Flex layout on your website
• Grid style requirements:
· grid-template-areas
- grid-template-columns
grid-template-rows
- grid-area
• Flex style requirements:
• flex-direction (can be set to row our column)
· flex-wrap
. flex-basis
. flex-grow - you must have one item that grows more than other flex items given available space!
· flex-shrink - you must have one item that shrinks more than other flex items given available space!
Create at least one transition](/v2/_next/image?url=https%3A%2F%2Fcontent.bartleby.com%2Fqna-images%2Fquestion%2F43bbb851-848e-4f2e-b75d-051d7d9a3f2c%2F7209b5c8-33c0-4dab-ab07-33321358d9dc%2Fu0hjow_processed.jpeg&w=3840&q=75)
![CSS Requirements
Separate your style sheets into three files:
• /styles/colors.css
• /styles/formatting.css
• /styles/transitions-animations.css
Create three break points using media queries in at least one style sheet to alter the way your website looks on small, medium and large devices
o it will help to view your current website on a mobile device and document what looks broken (overflow, small text, etc)
o start coding media queries after identifying elements of your website that need responsive behavior
Minimum of 25 unique CSS selectors (total across all style sheets). Your selectors must satisfy the requirements below:
• 1x Universal Selector
o >= 1x Type Selector
o >= 1 x Class Selector
o >= 1 x ID Selector
o >= 1 x Group Selector (ex: h1, p, a {/*styles here*/})
o >= 2 x Child Selector
• >= 2 x General Sibling Combinator (-)
o >= 2 x Adjacent Sibling Combinator (+)
• >= 2 x Pseudo Class Selector (ex: :nth-of-type)](/v2/_next/image?url=https%3A%2F%2Fcontent.bartleby.com%2Fqna-images%2Fquestion%2F43bbb851-848e-4f2e-b75d-051d7d9a3f2c%2F7209b5c8-33c0-4dab-ab07-33321358d9dc%2Fv43p2h_processed.jpeg&w=3840&q=75)
![](/static/compass_v2/shared-icons/check-mark.png)
Step by step
Solved in 3 steps with 6 images
![Blurred answer](/static/compass_v2/solution-images/blurred-answer.jpg)
![Computer Networking: A Top-Down Approach (7th Edi…](https://www.bartleby.com/isbn_cover_images/9780133594140/9780133594140_smallCoverImage.gif)
![Computer Organization and Design MIPS Edition, Fi…](https://www.bartleby.com/isbn_cover_images/9780124077263/9780124077263_smallCoverImage.gif)
![Network+ Guide to Networks (MindTap Course List)](https://www.bartleby.com/isbn_cover_images/9781337569330/9781337569330_smallCoverImage.gif)
![Computer Networking: A Top-Down Approach (7th Edi…](https://www.bartleby.com/isbn_cover_images/9780133594140/9780133594140_smallCoverImage.gif)
![Computer Organization and Design MIPS Edition, Fi…](https://www.bartleby.com/isbn_cover_images/9780124077263/9780124077263_smallCoverImage.gif)
![Network+ Guide to Networks (MindTap Course List)](https://www.bartleby.com/isbn_cover_images/9781337569330/9781337569330_smallCoverImage.gif)
![Concepts of Database Management](https://www.bartleby.com/isbn_cover_images/9781337093422/9781337093422_smallCoverImage.gif)
![Prelude to Programming](https://www.bartleby.com/isbn_cover_images/9780133750423/9780133750423_smallCoverImage.jpg)
![Sc Business Data Communications and Networking, T…](https://www.bartleby.com/isbn_cover_images/9781119368830/9781119368830_smallCoverImage.gif)