From 9cd1610839ac8beca834b9148879eb3ad95067f4 Mon Sep 17 00:00:00 2001
From: Dana Ottaviani <dana.ottaviani@gmail.com>
Date: Fri, 25 Jan 2019 12:13:07 -0500
Subject: [PATCH] Add solution to css-flexbox challenge (#34253)

<!-- Please follow this checklist and put an x in each of the boxes, like this: [x]. It will ensure that our team takes your pull request seriously. -->

- [x] I have read [freeCodeCamp's contribution guidelines](https://github.com/freeCodeCamp/freeCodeCamp/blob/master/CONTRIBUTING.md).
- [x] My pull request has a descriptive title (not a vague title like `Update index.md`)
- [x] My pull request targets the `master` branch of freeCodeCamp.
- [x] None of my changes are plagiarized from another source without proper attribution.
- [x] My article does not contain shortened URLs or affiliate links.


Co-authored-by: Paul Gamble <pgamble@gmail.com>
---
 ...-superpowers-to-the-tweet-embed.english.md | 93 ++++++++++++++++++-
 1 file changed, 91 insertions(+), 2 deletions(-)

diff --git a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
index dbc45c3f83..d0f4ab9a42 100644
--- a/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed.english.md
@@ -146,7 +146,96 @@ tests:
 ## Solution
 <section id='solution'>
 
-```js
-// solution required
+```html
+<style>
+  body {
+    font-family: Arial, sans-serif;
+  }
+  header {
+   display: flex;
+  }
+  header .profile-thumbnail {
+    width: 50px;
+    height: 50px;
+    border-radius: 4px;
+  }
+  header .profile-name {
+    display: flex;
+    margin-left: 10px;
+  }
+  header .follow-btn {
+    display: flex;
+    margin: 0 0 0 auto;
+  }
+  header .follow-btn button {
+    border: 0;
+    border-radius: 3px;
+    padding: 5px;
+  }
+  header h3, header h4 {
+    display: flex;
+    margin: 0;
+  }
+  #inner p {
+    margin-bottom: 10px;
+    font-size: 20px;
+  }
+  #inner hr {
+    margin: 20px 0;
+    border-style: solid;
+    opacity: 0.1;
+  }
+  footer {
+    display: flex;
+  }
+  footer .stats {
+    display: flex;
+    font-size: 15px;
+  }
+  footer .stats strong {
+    font-size: 18px;
+  }
+  footer .stats .likes {
+    margin-left: 10px;
+  }
+  footer .cta {
+    margin-left: auto;
+  }
+  footer .cta button {
+    border: 0;
+    background: transparent;
+  }
+</style>
+<header>
+  <img src="https://pbs.twimg.com/profile_images/378800000147359764/54dc9a5c34e912f34db8662d53d16a39_400x400.png" alt="Quincy Larson's profile picture" class="profile-thumbnail">
+  <div class="profile-name">
+    <h3>Quincy Larson</h3>
+    <h4>@ossia</h4>
+  </div>
+  <div class="follow-btn">
+    <button>Follow</button>
+  </div>
+</header>
+<div id="inner">
+  <p>I meet so many people who are in search of that one trick that will help them work smart. Even if you work smart, you still have to work hard.</p>
+  <span class="date">1:32 PM - 12 Jan 2018</span>
+  <hr>
+</div>
+<footer>
+  <div class="stats">
+    <div class="Retweets">
+      <strong>107</strong> Retweets
+    </div>
+    <div class="likes">
+      <strong>431</strong> Likes
+    </div>
+  </div>
+  <div class="cta">
+    <button class="share-btn">Share</button>
+    <button class="retweet-btn">Retweet</button>
+    <button class="like-btn">Like</button>
+  </div>
+</footer>
 ```
+
 </section>