gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added solution to Adjust the Color of Various Elements to Complementary Colors (#34362)

Browse Source 
* Update index.md

* Update index.md

* Update index.md
This commit is contained in:
The Coding Aviator
2019-01-27 08:26:15 +05:30
committed by Randell Dawson
parent ddb81086a9
commit 4783deafdc
1 changed files with 40 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
guide/english/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
View File

@ -3,28 +3,49 @@ title: Adjust the Color of Various Elements to Complementary Colors
---
## Adjust the Color of Various Elements to Complementary Colors
This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
### Hint
## Hints
Add the following code on the .blue-box and the corresponding values for each padding.
Then change 0px to corresponding values of paddings.
Change the colours of the given elements to the ones given in the problem.
Top - 40px
Right - 20px
Bottom - 20px
Left - 40px
### Solution
```css
<style>
.blue-box {
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
body {
background-color: white;
}
header {
background-color: #09A7A1;
color: white;
padding: 0.25em;
}
h2 {
color: #09A7A1;
}
button {
background-color: #FF790E;
}
footer {
background-color: #09A7A1;
color: white;
padding: 0.5em;
}
</style>
<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
<header>
<h1>Cooking with FCC!</h1>
</header>
<main>
<article>
<h2>Machine Learning in the Kitchen</h2>
<p>Join this two day workshop that walks through how to implement cutting-edge snack-getting algorithms with a command line interface. Coding usually involves writing exact instructions, but sometimes you need your computer to execute flexible commands, like <code>fetch Pringles</code>.</p>
<button>Sign Up</button>
</article>
<article>
<h2>Bisection Vegetable Chopping</h2>
<p>This week-long retreat will level-up your coding ninja skills to actual ninja skills. No longer is the humble bisection search limited to sorted arrays or coding interview questions, applying its concepts in the kitchen will have you chopping carrots in O(log n) time before you know it.</p>
<button>Sign Up</button>
</article>
</main>
<br>
<footer>&copy; 2018 FCC Kitchen</footer>
```