These are chat archives for FreeCodeCamp/Help

15th
Oct 2016
luca
@lucamunduz
Oct 15 2016 00:01
cool im on the challenge where you have to resize the image and still not really sure about the layout
Garrus Napp
@GarrusNapp
Oct 15 2016 00:02
@lucamunduz show your code
luca
@lucamunduz
Oct 15 2016 00:02
think i may have figured it out
dherrera-code
@dherrera-code
Oct 15 2016 00:04
hello
could anyone help me?
Garrus Napp
@GarrusNapp
Oct 15 2016 00:05
@dherrera-code yes, what's the problem
dherrera-code
@dherrera-code
Oct 15 2016 00:05
I am in my HTML and CSS challenge
How do you assign a class to an image?
y have already create de style
Garrus Napp
@GarrusNapp
Oct 15 2016 00:05
@dherrera-code same way you assigned a class to h2
luca
@lucamunduz
Oct 15 2016 00:06
@dherrera-code couldnt figure it out

@dherrera-code <style>
.smaller-image {
width: 100px
}
</style>

<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

dherrera-code
@dherrera-code
Oct 15 2016 00:06
but the class should be after or before the src?
Garrus Napp
@GarrusNapp
Oct 15 2016 00:06
@dherrera-code doesn't matter
i put classes usually as a first attribute
Pranay Kumar
@pranaykumar389
Oct 15 2016 00:06

Hi Everybody, can anyone simplify my solution for the Seek and Destroy Challenge....
I solved this challenge without using filter().

function destroyer(arr) {
// Remove all the values
var arr1 = [], arr2 = [], count = 0;
for(var j = 1; j < arguments.length; j++) {
arr1.push(arguments[j]);
}
for(var i = 0; i < arr.length; i++) {
if(arr1.indexOf(arr[i]) < 0){
arr2[count] = arr[i];
count++;
}
}
return arr2;
}

Garrus Napp
@GarrusNapp
Oct 15 2016 00:08
@rudrapranaykumar does it work?
Pranay Kumar
@pranaykumar389
Oct 15 2016 00:08
yes
dherrera-code
@dherrera-code
Oct 15 2016 00:09
I have it like this

<style>
.smaller-image {
width:100px;
}
</style>

<img class="smaller-image"src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

Ohh nice, it works
Garrus Napp
@GarrusNapp
Oct 15 2016 00:10
then you don't have work with it anymore @rudrapranaykumar but if you want just try that filter thing it's not that hard
dherrera-code
@dherrera-code
Oct 15 2016 00:11
So, you can put the class like this? And it should work too?
<img src="https://bit.ly/fcc-relaxing-cat" class="smaller-image"alt="A cute orange cat lying on its back. ">
Oh yeah, i see it know
thanks
@GarrusNapp
Pranay Kumar
@pranaykumar389
Oct 15 2016 00:12
@GarrusNapp it's typical to get solve the challenge using filter(). Anyways thank you for reply
CamperBot
@camperbot
Oct 15 2016 00:12
rudrapranaykumar sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:cookie: 432 | @garrusnapp |http://www.freecodecamp.com/garrusnapp
Garrus Napp
@GarrusNapp
Oct 15 2016 00:13
@rudrapranaykumar yea the filter iterates, same way you did manually. But it's less code! :)
Pranay Kumar
@pranaykumar389
Oct 15 2016 00:17
@GarrusNapp Alright, Thank you :sparkles: :thumbsup: :sparkles:
CamperBot
@camperbot
Oct 15 2016 00:17
rudrapranaykumar sends brownie points to @garrusnapp :sparkles: :thumbsup: :sparkles:
:warning: rudrapranaykumar already gave garrusnapp points
bria
@Jahbria
Oct 15 2016 00:17
Can someone help me with this
<style>
h2{color: blue;}
</style>
i just started
Garrus Napp
@GarrusNapp
Oct 15 2016 00:17
@Jahbria that is correct. Doesn't work?
bria
@Jahbria
Oct 15 2016 00:18
no
Garrus Napp
@GarrusNapp
Oct 15 2016 00:18
@Jahbria what about the rest of code?
bria
@Jahbria
Oct 15 2016 00:18
@GarrusNapp What do you mean by that?
Garrus Napp
@GarrusNapp
Oct 15 2016 00:19
do you have more code?
bria
@Jahbria
Oct 15 2016 00:19
yes
Garrus Napp
@GarrusNapp
Oct 15 2016 00:19
show me
bria
@Jahbria
Oct 15 2016 00:19
okay

<style>
h2{color: blue;}
</style>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

Riyuno
@iCantCodeYet
Oct 15 2016 00:20
Hey, can someone tell me how I can get my navigation inside the header i created? Its always under the header!
Garrus Napp
@GarrusNapp
Oct 15 2016 00:21
@Jahbria you don't have your <h2> element, and if it doesn't exist it can't be blue :D
@iCantCodeYet link to codepen?
Riyuno
@iCantCodeYet
Oct 15 2016 00:21
codepen? lol, 1sec
Garrus Napp
@GarrusNapp
Oct 15 2016 00:22
yea that would be the easiest
bria
@Jahbria
Oct 15 2016 00:24
@GarrusNapp okay I know what you mean bye that, so should I add h2 {color: blue;} CatPhotoShop
Garrus Napp
@GarrusNapp
Oct 15 2016 00:25
@Jahbria not. The style part was ok
You need to have <h2> similar to your <p>
i guess
lol this is actually really cool, didnt know such a thing exists
bria
@Jahbria
Oct 15 2016 00:27

@GarrusNapp <style>

<h2> {color: blue;} CatPhotoShop </h2>
</style>
i tried this but theres still an error

Garrus Napp
@GarrusNapp
Oct 15 2016 00:27
@Jahbria leave the <style> as you had before. then add just <h2>CatPhotoApp</h2> after </style>
Girzima
@Girzima
Oct 15 2016 00:31
@iCantCodeYet What are you trying to do?
bria
@Jahbria
Oct 15 2016 00:31

@GarrusNapp <style>
{color: blue;}

<h2>CatPhotoShop</h2>
</style>

like this?
Riyuno
@iCantCodeYet
Oct 15 2016 00:31
i want my links to be on the header
Girzima
@Girzima
Oct 15 2016 00:31
What do you mean header. You mean the nav?
Like the very top
Garrus Napp
@GarrusNapp
Oct 15 2016 00:31
@Jahbria no. <h2>CatPhotoShop</h2> goes outside the style
Riyuno
@iCantCodeYet
Oct 15 2016 00:31
yes
Garrus Napp
@GarrusNapp
Oct 15 2016 00:32
it's App not Shop
Girzima
@Girzima
Oct 15 2016 00:32
Put your content in your nav and section your nav
Then float it
Where do you want the buttons, the right?
Riyuno
@iCantCodeYet
Oct 15 2016 00:32
In the middle
what do you mean "section your nav"? like : <section><nav></nav></section>?
Girzima
@Girzima
Oct 15 2016 00:34
I don't know exactly, you'd have to give me an exact idea of what you want
Steven
@thefishboy
Oct 15 2016 00:35
i created and closed a script element but it is saying that i didn't, any suggestions?
bria
@Jahbria
Oct 15 2016 00:35

@GarrusNapp i tried this <style>
{color: blue;}
</style>

<h2>CatPhotoApp</h2>

Girzima
@Girzima
Oct 15 2016 00:36
You want everything in the middle like LoL fanpage on top of the buttons or side by side?
Riyuno
@iCantCodeYet
Oct 15 2016 00:37
http://euw.leagueoflegends.com/ on the very top there are links ordered
i want to make the same thing
Girzima
@Girzima
Oct 15 2016 00:38
And where does the fanpage font fit in? They have a standard nav
Steven
@thefishboy
Oct 15 2016 00:38
nevermind got i
it
Riyuno
@iCantCodeYet
Oct 15 2016 00:39
well
you see the links are made are under the black thingy
that are *
i want them to be inside the black thingy
Girzima
@Girzima
Oct 15 2016 00:41
Okay, and the fanpage font goes where?
Stays there?
Riyuno
@iCantCodeYet
Oct 15 2016 00:42
yes
Jacob mercer
@codemichaelmercer
Oct 15 2016 00:43
has anyone landed a job yet
???
Riyuno
@iCantCodeYet
Oct 15 2016 00:43
still in highschool
Jacob mercer
@codemichaelmercer
Oct 15 2016 00:43
nice
Oleh Shalyhin
@oleh-shalyhin
Oct 15 2016 00:46
yeah, ofc
Cole Maly
@malycole
Oct 15 2016 00:50
Question: I'm trying to create an opaque border with margin: 20px; from the edge of the screen
given that I'm using .container-fluid. It seems to me as though the properties of .container-fluid won't allow for me to adjust the margins of the background class unless I use !important. I know I'm missing something, can anyone help?
abisai101
@abisai101
Oct 15 2016 00:52
how can I change the style element?
Girzima
@Girzima
Oct 15 2016 00:54
@iCantCodeYet I figured out exactly what LoL does in their nav
@iCantCodeYet First off you need to fix your top div. What is it supposed to be, a nav with a heading?
abisai101
@abisai101
Oct 15 2016 00:57
Does anyone know anything about the CSS Selectors style?
Coy Sanders
@coymeetsworld
Oct 15 2016 00:58
style is just a set of html tags where you put CSS in
Coy Sanders
@coymeetsworld
Oct 15 2016 00:58
remove the img from your style @coder-97
what you want to do is create the class smaller-image, then apply it to your img tag
just like you created red-text class and applied it to your h2/p tags
coder-97
@coder-97
Oct 15 2016 00:59
ok. thanks
Coy Sanders
@coymeetsworld
Oct 15 2016 00:59
np
coder-97
@coder-97
Oct 15 2016 01:04
@coymeetsworld uhm this is what I did: <img class=".smaller-image { width: 100px }" src="https://bit.ly/fcc-relaxing-cat" alt="Ugly cat laying on its back. “>
Coy Sanders
@coymeetsworld
Oct 15 2016 01:04
no so you just want to refer to the class name in the img tag @coder-97
you still want to define the class inside the style tags
youre basically following the same syntax you did with red-text
define it inside style tags, refer to it by its name in the html elements
coder-97
@coder-97
Oct 15 2016 01:04
ok
Riyuno
@iCantCodeYet
Oct 15 2016 01:05
@Girzima thx for your help, i tried it with creating a div and now it should work, ill send you the end result of the heading if you want !!
CamperBot
@camperbot
Oct 15 2016 01:05
icantcodeyet sends brownie points to @girzima :sparkles: :thumbsup: :sparkles:
:cookie: 251 | @girzima |http://www.freecodecamp.com/girzima
Girzima
@Girzima
Oct 15 2016 01:06
@iCantCodeYet I didn't really do anything but ok lol
Riyuno
@iCantCodeYet
Oct 15 2016 01:07
my bad for my terrible english skillz
you reminded me of the div tag, thats enough xd
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:07

You can use Bootstrap's col-xs-* classes on form elements, too! This way, our radio buttons will be evenly spread out across the page, regardless of how wide the screen resolution is.

Nest all of your radio buttons within a <div class="row"> element. Then nest each of them within a <div class="col-xs-6"> element.

Run tests (ctrl + enter)
Reset Help Bug
Nest all of your radio buttons inside one div with the class row.
Nest each of your radio buttons inside its own div with the class col-xs-6.
Make sure each of your div elements has a closing tag.

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
h2 {
font-family: Lobster, Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}
</style>

<div class="container-fluid">
<div class="row">
<div class="col-xs-8">
<h2 class="text-primary text-center">CatPhotoApp</h2>
</div>
<div class="col-xs-4">
<a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>
</div>
</div>
<img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera. ">
<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
<p>Things cats <span class="text-danger">love:</span></p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>

what am I supposed to do?
Girzima
@Girzima
Oct 15 2016 01:08
@Ace-Monkey-Ilium Can you post the actual link, not juts the code? That's too much to read lol
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:09
I need help
What am I supposed to do?
please teach me
bria
@Jahbria
Oct 15 2016 01:09
can someone help me with this

<style>
.red-text {
color: red;

.font-size {
font-size: 16p;
}
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p "font-size"> Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:10
https://www.freecodecamp.com/challenges/responsively-style-radio-buttons#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Cdiv%20class%3D%22container-fluid%22%3E%0A%20%20%3Cdiv%20class%3D%22row%22%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-8%22%3E%0A%20%20%20%20%20%20%3Ch2%20class%3D%22text-primary%20text-center%22%3ECatPhotoApp%3C%2Fh2%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-4%22%3E%0A%20%20%20%20%20%20%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22img-responsive%20thick-green-border%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%3E%3C%2Fa%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%3C%2Fdiv%3E%0A%20%20%3Cimg%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-running-cats%22%20class%3D%22img-responsive%22%20alt%3D%22Three%20kittens%20running%20towards%20the%20camera.%20%22%3E%0A%20%20%3Cdiv%20class%3D%22row%22%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-block%20btn-primary%22%3E%3Ci%20class%3D%22fa%20fa-thumbs-up%22%3E%3C%2Fi%3E%20Like%3C%2Fbutton%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-block%20btn-info%22%3E%3Ci%20class%3D%22fa%20fa-info-circle%22%3E%3C%2Fi%3E%20Info%3C%2Fbutton%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-block%20btn-danger%22%3E%3Ci%20class%3D%22fa%20fa-trash%22%3E%3C%2Fi%3E%20Delete%3C%2Fbutton%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%3C%2Fdiv%3E%0A%20%20%3Cp%3EThings%20cats%20%3Cspan%20class%3D%22text-danger%22%3Elove%3A%3C%2Fspan%3E%3C%2Fp%3E%0A%20%20%3Cul%3E%0A%20%20%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%20%20%3C%2Ful%3E%0A%20%20%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%20%20%3Col%3E%0A%20%20%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%20%20%3C%2Fol%3E%0A%20%20%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Indoor%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Outdoor%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Loving%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Lazy%3C%2Flabel%3E%0A%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Crazy%3C%2Flabel%3E%0A%20%20%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%20required%3E%0A%20%20%20%20%3Cbutton%20type%3D%22submit%22%3ESubmit%3C%2Fbutton%3E%0A%20%20%3C%2Fform%3E%0A%3C%2Fdiv%3E%0A
what am I supposed to do here?
Coy Sanders
@coymeetsworld
Oct 15 2016 01:10
@Jahbria you have one too many closing brackets in your style, also font size is 16px, not 16p
<p "font-size"> that should just be p too
the way it works is if you define a style for p, all p tags will get it. No class no id, just the tag
coder-97
@coder-97
Oct 15 2016 01:12
Ok I am now lost
Walid Ashri
@walidashri
Oct 15 2016 01:12
@coymeetsworld p class="font-size" I think
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:12
what am I supposed to do?
bria
@Jahbria
Oct 15 2016 01:12
@coymeetsworld so i have to delete the "font-size" ?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:12
Please someone help me
Girzima
@Girzima
Oct 15 2016 01:12
@Ace-Monkey-Ilium Okay, first off change your col-xs-6 back to col-xs-4
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:12
okay I did that
Girzima
@Girzima
Oct 15 2016 01:13
@Ace-Monkey-Ilium A row has 12 columns, you put 18 in yours (6+6+6)
Nest all of your radio buttons inside one div with the class row. @Ace-Monkey-Ilium
Coy Sanders
@coymeetsworld
Oct 15 2016 01:13
nope @walidashri
its not a class
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:13
how do you nest them?
Coy Sanders
@coymeetsworld
Oct 15 2016 01:13
yes remove it @Jahbria
Girzima
@Girzima
Oct 15 2016 01:14

<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>

@Ace-Monkey-Ilium These are your radio buttons. Nest a <div class="row"></div> around them like you did with the other row

bria
@Jahbria
Oct 15 2016 01:14

@coymeetsworld <style>
.red-text {
color: red;

.p
font-size: 16px

</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p> Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Girzima
@Girzima
Oct 15 2016 01:14
So <div class="row"> before the first one and </div> after the last one @Ace-Monkey-Ilium
bria
@Jahbria
Oct 15 2016 01:14
like this?
Coy Sanders
@coymeetsworld
Oct 15 2016 01:14
no
so you're missing your brackets
and no dot before p
dot before the name means you're defining a class
if you don't use a dot, you're targeting an actual html element
like if i did
h2 {
  font-size: 30px;
}
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:15
wait so ... I'M sorry it is getting confusing
Girzima
@Girzima
Oct 15 2016 01:15
@Jahbria You're targeting p which is a plain element, not a class or id. No dots
Coy Sanders
@coymeetsworld
Oct 15 2016 01:15
<h2>This text size will be 30px</h2>
Girzima
@Girzima
Oct 15 2016 01:15
@Ace-Monkey-Ilium Nest all of your radio buttons inside one div with the class row.
bria
@Jahbria
Oct 15 2016 01:16
oh okay i got it
thank you
Girzima
@Girzima
Oct 15 2016 01:16

@Ace-Monkey-Ilium

<div class="row">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
</div>

Coy Sanders
@coymeetsworld
Oct 15 2016 01:16
np
Girzima
@Girzima
Oct 15 2016 01:16
We're putting it AROUND our radio buttons
Nesting our radio buttons inside the row
(inside)
Fabusuyi David Oluwasegun
@dav4thevid
Oct 15 2016 01:17

<style>
2
{color: blue;} </style> <h2>>CatPhotoApp<</h2>
3

4

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
5

Please can anyone help me with that
Girzima
@Girzima
Oct 15 2016 01:18
@dav4thevid What challenge is that?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:20
How do you nest them?
why outdoor and indoor?
juancbaires
@juancbaires
Oct 15 2016 01:21
it needs a class or id
if your going to use css that is
Girzima
@Girzima
Oct 15 2016 01:21
@Ace-Monkey-Ilium Those are your radio buttons (the circular ones)
Fabusuyi David Oluwasegun
@dav4thevid
Oct 15 2016 01:22
@Girzima it's using css to style elements
juancbaires
@juancbaires
Oct 15 2016 01:22
if not in line would be like this <h2 style="color: blue">CatPhotoApp</h2> @dav4thevid
if its css it should be h2 class ="whatever" or id="whatever"
Girzima
@Girzima
Oct 15 2016 01:23

@Ace-Monkey-Ilium Nesting means putting something around or inside something else.

<div>
<p>Paragraph</p>
</div>

Here, we have our p nested INSIDE our div. OR another way of saying it is we have our div nested AROUND our p

Make sense?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:24
Yes but I did that
codingpower
@codingpower
Oct 15 2016 01:25
how do i make my Bootstrap buttons be nested within its own div element with the class col-xs-4? anyone know?.
juancbaires
@juancbaires
Oct 15 2016 01:26
@coder-97 what are you trying to do add a class to image?
Girzima
@Girzima
Oct 15 2016 01:27
@Ace-Monkey-Ilium If you did that then you need to put each radio button inside a col-xs-6 now
Riyuno
@iCantCodeYet
Oct 15 2016 01:27
YO
coder-97
@coder-97
Oct 15 2016 01:27
I@juancbaires I am trying to change the pic size to 100 pixels
Sef Sheek
@s3f
Oct 15 2016 01:28
Hey guys I’m kinda stuck on challenge 64 could use some help
Riyuno
@iCantCodeYet
Oct 15 2016 01:28
i still have one problem
Fabusuyi David Oluwasegun
@dav4thevid
Oct 15 2016 01:28
@juancbaires I tried what u said......but it still not working
codingpower
@codingpower
Oct 15 2016 01:28
help
me
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:29

yes I did that too

<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>

Girzima
@Girzima
Oct 15 2016 01:29
@iCantCodeYet It's not all on the same line, you just have the li text-centered
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:29
@Girzima please help me
codingpower
@codingpower
Oct 15 2016 01:29
it says Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4. how do i do that?
coder-97
@coder-97
Oct 15 2016 01:29
@juancbaires I’m trying to change the image size to 100
codingpower
@codingpower
Oct 15 2016 01:30
t says Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4. how do i do that?
Girzima
@Girzima
Oct 15 2016 01:30
@Ace-Monkey-Ilium I've explained this. There are 12 columns in a row, you have 18. Change those back to 4 and put the row around the radio buttons and each radio button gets a <div col-xs-6></div> around it
Riyuno
@iCantCodeYet
Oct 15 2016 01:30
That is my problem @Girzima, i dont know how to make the links on the same line as the title
Girzima
@Girzima
Oct 15 2016 01:30
@coder-97 Your img element should have the class smaller-image.
juancbaires
@juancbaires
Oct 15 2016 01:31
@coder-97 you might have to change your zoom in browser to
too*
Girzima
@Girzima
Oct 15 2016 01:31
@coder-97 class="smaller-image"
coder-97
@coder-97
Oct 15 2016 01:31
oh ok
Girzima
@Girzima
Oct 15 2016 01:31
also remove that "img" in your css
codingpower
@codingpower
Oct 15 2016 01:31
it says Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4. how do i do that?
coder-97
@coder-97
Oct 15 2016 01:31
ok
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:31

@Girzima How about now?

<div class="row" class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>

Is that how it is supposed to be? @Girzima
codingpower
@codingpower
Oct 15 2016 01:32
t says Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4. how do i do that?
Girzima
@Girzima
Oct 15 2016 01:32
@codingpower That would be <div class="col-xs-4"> .... </div> And your button goes inside it
juancbaires
@juancbaires
Oct 15 2016 01:32
.smaller-image {
    width: 100px;
  }

</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class= smaller-image src="https://bit.ly/fcc-relaxing-cat" alt="Ugly cat laying on its back. ">
@coder-97
coder-97
@coder-97
Oct 15 2016 01:33
Thanks heaps @Girzima @juancbaires
Riyuno
@iCantCodeYet
Oct 15 2016 01:33
How can i make the links and the title be on the same line?
CamperBot
@camperbot
Oct 15 2016 01:33
coder-97 sends brownie points to @girzima and @juancbaires :sparkles: :thumbsup: :sparkles:
:cookie: 252 | @girzima |http://www.freecodecamp.com/girzima
:cookie: 256 | @juancbaires |http://www.freecodecamp.com/juancbaires
codingpower
@codingpower
Oct 15 2016 01:33
i will try that @Girzima
Girzima
@Girzima
Oct 15 2016 01:33
@codingpower You're creating a bootstrap row. A row represents a horizontal div that has 12 columns, you're making each button take up 4 columns to total 12, or 1/3 of the row
codingpower
@codingpower
Oct 15 2016 01:33
@Girzima it says t says Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4. how do i do that?
Girzima
@Girzima
Oct 15 2016 01:34
@Ace-Monkey-Ilium No. You need to reset your code. You keep changing your buttons instead of what you're being asked to
how am i supposed to do this?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:35
Now what am I supposed to do? @Girzima
<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
@Girzima
Girzima
@Girzima
Oct 15 2016 01:36
@iCantCodeYet There's a few ways. LoL page uses table cells, or you could just float everything next to each other. I'm not sure how you'd put the buttons in the center if you do that without messing with it and I'm busy as you can see D;
codingpower
@codingpower
Oct 15 2016 01:36
@Girzima can u help me
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:36
I hate CODING BECAUSE NO ONE HELPS ME
Girzima
@Girzima
Oct 15 2016 01:36
lol ok
@codingpower I've explained this. Did you read what I said about rows and columns?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:37
FREECODECAMP IS STUPID BECAUSE THEY DON'T HAVE PEOPLE THAT COULD TEACH ME STUFF
HELP ME
CamperBot
@camperbot
Oct 15 2016 01:37

:point_right: readme [wiki]

Depecrated Wiki!

This repo serves as an archive for the wiki and a place to report issues for our current wiki located in our forum!

Our open source community's Wiki focuses on answering your questions about learning to code and getting a coding job. We also cover in detail our:

  • Curriculum
  • Other Programming Languages
  • Local Group Communities
  • Nonprofit Projects and much more

:pencil: read more about readme on the FCC Wiki

Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:37
SOMEONE HELP ME
please help me someone
HELP ME
CamperBot
@camperbot
Oct 15 2016 01:39

:point_right: readme [wiki]

Depecrated Wiki!

This repo serves as an archive for the wiki and a place to report issues for our current wiki located in our forum!

Our open source community's Wiki focuses on answering your questions about learning to code and getting a coding job. We also cover in detail our:

  • Curriculum
  • Other Programming Languages
  • Local Group Communities
  • Nonprofit Projects and much more

:pencil: read more about readme on the FCC Wiki

Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:40
I am never gonna used this site ever again!!!
Chase Cohn
@chasecohn
Oct 15 2016 01:40
anyone there?
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:40
@Girzima are you there?
codingpower
@codingpower
Oct 15 2016 01:40
@Girzima
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:40
I am quitting
Jacob mercer
@codemichaelmercer
Oct 15 2016 01:40
wow i just wasted like 30 minutes figuring out a simple problem
Ace-Monkey-Ilium
@Ace-Monkey-Ilium
Oct 15 2016 01:40
bye guys forevery
forever
Girzima
@Girzima
Oct 15 2016 01:41
@codingpower @chasecohn ?
Jacob mercer
@codemichaelmercer
Oct 15 2016 01:41
why r u leaving
codingpower
@codingpower
Oct 15 2016 01:41
@Girzima It did work! I did not realize I had to that for each and every button I created and then close with another </div>
@Girzima THANK YOU!!!
CamperBot
@camperbot
Oct 15 2016 01:41
codingpower sends brownie points to @girzima :sparkles: :thumbsup: :sparkles:
:cookie: 254 | @girzima |http://www.freecodecamp.com/girzima
Girzima
@Girzima
Oct 15 2016 01:41
@codemichaelmercer Leave it. I tried explaining something to them 4 times and they got upset and started spamming
Riyuno
@iCantCodeYet
Oct 15 2016 01:41
that helped me
Jacob mercer
@codemichaelmercer
Oct 15 2016 01:42
dang
Girzima
@Girzima
Oct 15 2016 01:42
@iCantCodeYet On the LoL page they applied display: table-cell; to all of their nav content
It's new to me, that's why I took so long figuring it out. I'm new myself
Riyuno
@iCantCodeYet
Oct 15 2016 01:44
i dont want my site be exactly like the LoL site, just used it as an example !!! the float thingy helpted me. @Girzima
Girzima
@Girzima
Oct 15 2016 01:44
I was just saying
Riyuno
@iCantCodeYet
Oct 15 2016 01:44
helpted lol
Chase Cohn
@chasecohn
Oct 15 2016 01:44
Can someone please paste the right code?
Girzima
@Girzima
Oct 15 2016 01:44
I use float generally but I'll start looking into table cells now though
@chasecohn What do you need?
Sef Sheek
@s3f
Oct 15 2016 01:44
could one of you guys look at my code and help me out. What I’m stuck on is when it says Make sure you have nested all HTML elements in .container-fluid

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}

</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<div class = "container-fluid">

</div>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>

<p>Things cats love:</p>

<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>

<p>Top 3 things cats hate:</p>

<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

Girzima
@Girzima
Oct 15 2016 01:45
@s3f Around all of your HTML. That means above your top h2 and below your bottom /form
Lazybones101
@lazybones101
Oct 15 2016 01:45

Help out. <style>
.red-text {
color: red;
}
.smaller-image {
width: 300px
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

CamperBot
@camperbot
Oct 15 2016 01:45
no wiki entry for: out style red-text color red smaller-image width 300px h2 font-family lobster monospace p font-size 16px font-family monospace styleh2 classred-textcatphotoapph2img classsmaller-image srchttpsbitlyfcc-relaxing-cat alta cute orange cat lying on its back
Girzima
@Girzima
Oct 15 2016 01:46
@chasecohn You know how you applied the red-text class to your h2, right?
Lazybones101
@lazybones101
Oct 15 2016 01:47
Yes
Chase Cohn
@chasecohn
Oct 15 2016 01:47
@Girzima yes
Girzima
@Girzima
Oct 15 2016 01:47
@lazybones101 Wasn't talking to you but it's 100px; not 300px, also you missed the semi colon

@chasecohn Your img element should have the class smaller-image

So we're going to add class="smaller-image" to our image

We can do this by just putting it in the opening img tag like this <img class="" src="">

Lazybones101
@lazybones101
Oct 15 2016 01:49
Yes i am still not getting it.
Girzima
@Girzima
Oct 15 2016 01:50
Post your new code then
Sef Sheek
@s3f
Oct 15 2016 01:52
@Girzima so I did that but it’s still not letting me pass. Says make sure div element has a closing tag
Girzima
@Girzima
Oct 15 2016 01:52
@s3f Code?
Lazybones101
@lazybones101
Oct 15 2016 01:52

<style>
.red-text {
color: red;
}
.smaller-image {
width: 100px;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

Sef Sheek
@s3f
Oct 15 2016 01:53
<div class = "container-fluid">
h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}

</style>
<div class = "container-fluid">
<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>

<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>
Girzima
@Girzima
Oct 15 2016 01:53
@s3f No. Not above your CSS (style). Above your HTML (below </style>)
Platon Dusha
@platontw
Oct 15 2016 01:54
Can someone Help me please , I'm stuck in Change the Font Size of an Element ?
tiepmy23
@tiepmy23
Oct 15 2016 01:54
@camperbot , Thank you for the link readme [WIKI]. I am new to this whole coding thing and was also stuck on 'nesting an i element into the button element from this challenge https://www.freecodecamp.com/challenges/add-font-awesome-icons-to-our-buttons I think I am confused on nesting. Is it simply surrounding the proposed element? The challenge instructs to place the i element within the classes.
CamperBot
@camperbot
Oct 15 2016 01:54
tiepmy23 sends brownie points to @camperbot :sparkles: :thumbsup: :sparkles:
:star2: 2487 | @camperbot |http://www.freecodecamp.com/camperbot
Girzima
@Girzima
Oct 15 2016 01:54
@lazybones101 Can you post the challenge url?
Sef Sheek
@s3f
Oct 15 2016 01:54

@Girzima here’s my whole code.

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

<div class = "container-fluid" h2 { font-family: Lobster, Monospace; } p { font-size: 16px; font-family: Monospace; } .thick-green-border { border-color: green; border-width: 10px; border-style: solid; border-radius: 50%; } .smaller-image { width: 100px; } </style>
<div class = "container-fluid">
<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>

<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>

Platon Dusha
@platontw
Oct 15 2016 01:55

<style>
.red-text {
color: red;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<style>
.red-text {
color: red;
}
p2 {
font-size: 16px;
}
</style>

<p2 class=red-text>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
</p2>

Girzima
@Girzima
Oct 15 2016 01:55
Remove the div in your style lol
Platon Dusha
@platontw
Oct 15 2016 01:55

I need to :

You need 2 p elements with Kitty Ipsum text.
Make sure each of your p elements has a closing tag.
Your p element should contain the first few words of the provided additional kitty ipsum text.
The first p element should have the class red-text.
Do not add a class attribute to the second p element.
Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.

Chase Cohn
@chasecohn
Oct 15 2016 01:56
@Girzima I tinkered around with it and finally got it. Thank you!
CamperBot
@camperbot
Oct 15 2016 01:56
chasecohn sends brownie points to @girzima :sparkles: :thumbsup: :sparkles:
:cookie: 255 | @girzima |http://www.freecodecamp.com/girzima
Sef Sheek
@s3f
Oct 15 2016 01:56
@Girzima haha it worked now. Thanks!
CamperBot
@camperbot
Oct 15 2016 01:56
s3f sends brownie points to @girzima :sparkles: :thumbsup: :sparkles:
:cookie: 256 | @girzima |http://www.freecodecamp.com/girzima
Girzima
@Girzima
Oct 15 2016 01:57
Makes me anxious helping so many people at once. I'm glad you both figured it out lol
Platon Dusha
@platontw
Oct 15 2016 01:59
Thanks in advance :)
Nirmal Patel
@patelnk4
Oct 15 2016 01:59
@Girzima thanks for helping lots of people. you the real MVP
CamperBot
@camperbot
Oct 15 2016 01:59
patelnk4 sends brownie points to @girzima :sparkles: :thumbsup: :sparkles:
:cookie: 259 | @girzima |http://www.freecodecamp.com/girzima
Riyuno
@iCantCodeYet
Oct 15 2016 01:59
im almost done i guess
but how can i make the links have the same height as the navbar
Girzima
@Girzima
Oct 15 2016 02:01
@patelnk4 Generally dead at this hour, I'm used to it
Nirmal Patel
@patelnk4
Oct 15 2016 02:03
@Girzima I have a question not sure if you could help. when i try to edit the code and click on it. it randomly ends up editing the code somewhere else and not where i clicked
Girzima
@Girzima
Oct 15 2016 02:03
where at?
Nirmal Patel
@patelnk4
Oct 15 2016 02:04
on freecodecamp where we edit the code for cat app
Girzima
@Girzima
Oct 15 2016 02:04
press space before you edit
sometimes that happens
Riyuno
@iCantCodeYet
Oct 15 2016 02:04
@Girzima help me please
Girzima
@Girzima
Oct 15 2016 02:05
@iCantCodeYet what do you need
Platon Dusha
@platontw
Oct 15 2016 02:05
Solve it :)
Nirmal Patel
@patelnk4
Oct 15 2016 02:05
thanks man will try it. please everyone do thank the people that help you by clicking on their uswername and type thanks
Riyuno
@iCantCodeYet
Oct 15 2016 02:05
so you see that the height of my links is smaller than the height of the navigationbar
Girzima
@Girzima
Oct 15 2016 02:06
@patelnk4 Same thing with copy pasting. It will grab different code, it's just buggy. Assuming that's the bug you mean
Riyuno
@iCantCodeYet
Oct 15 2016 02:06
i want them to match
Chase Cohn
@chasecohn
Oct 15 2016 02:07
@Girzima Can you tell me what I did wrong on this one please?
https://www.freecodecamp.com/challenges/add-borders-around-your-elements#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cimg%20class%3D%22smaller-image%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20class%3D%22thick-green-border%22%3E%0A%0A%3Cp%20class%3D%22red-text%22%3EKitty%20ipsum%20dolor%20sit%20amet%2C%20shed%20everywhere%20shed%20everywhere%20stretching%20attack%20your%20ankles%20chase%20the%20red%20dot%2C%20hairball%20run%20catnip%20eat%20the%20grass%20sniff.%3C%2Fp%3E%0A%3Cp%20class%3D%22red-text%22%3EPurr%20jump%20eat%20the%20grass%20rip%20the%20couch%20scratched%20sunbathe%2C%20shed%20everywhere%20rip%20the%20couch%20sleep%20in%20the%20sink%20fluffy%20fur%20catnip%20scratched.%3C%2Fp%3E%0A
tiepmy23
@tiepmy23
Oct 15 2016 02:09
@chasecohn , there is a coma instead of : after Lobster.
@chasecohn , oops nvm it should be ,
Walid Ashri
@walidashri
Oct 15 2016 02:11
@chasecohn for 2 classes u go like this class=" 1st-className 2nd-className"
Chase Cohn
@chasecohn
Oct 15 2016 02:13
@walidashri I don't understand what I should do
Walid Ashri
@walidashri
Oct 15 2016 02:14
u add 2 class atrr in the img tag remove last one and put all in one class atrr
like this <img class="smaller-image thick-green-border"
Girzima
@Girzima
Oct 15 2016 02:14
@iCantCodeYet Took way too long, sorry
Chase Cohn
@chasecohn
Oct 15 2016 02:15
@walidashri Thanks man I got it
CamperBot
@camperbot
Oct 15 2016 02:15
chasecohn sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @walidashri |http://www.freecodecamp.com/walidashri
Walid Ashri
@walidashri
Oct 15 2016 02:16
@chasecohn :+1:
Girzima
@Girzima
Oct 15 2016 02:16
@iCantCodeYet couple things you need to fix. Put your links in a separate div
Riyuno
@iCantCodeYet
Oct 15 2016 02:16
and then?
oh
wait
i done that
1sec
Sriza Sen
@mailmesriza98
Oct 15 2016 02:17
the iAdd an h4 element to each of your <div class="col-xs-6"> elements.
One h4 element should have the text #left-well.
One h4 element should have the text #right-well.
Make sure all your h4 elements have closing tags.nstructions are :
I wrote
<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
</div>
</div>
<div class="col-xs-6">
<h4>#right well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
<button class="btn btn-default target"></button>
</div>
</div>
</div>
</div>
What is wrong here
Girzima
@Girzima
Oct 15 2016 02:17
@iCantCodeYet get rid of that linkref in CSS. Float that div you make right
Sriza Sen
@mailmesriza98
Oct 15 2016 02:18
Code not working
Tyler
@Tylercarissa
Oct 15 2016 02:18
How do you give a body element a color property?
Sriza Sen
@mailmesriza98
Oct 15 2016 02:18
Please help
me with what is wrong in my code
ahmad
@woat
Oct 15 2016 02:19
whats ur code
oh you wrote it up at top
Sriza Sen
@mailmesriza98
Oct 15 2016 02:19
I pasted it a while ago
Please help
Coy Sanders
@coymeetsworld
Oct 15 2016 02:20
@Tylercarissa background color or font color?
Tyler
@Tylercarissa
Oct 15 2016 02:20
@coymeetsworld font color
Coy Sanders
@coymeetsworld
Oct 15 2016 02:21
You can use CSS for either:
body {
  color: red;
}
Tyler
@Tylercarissa
Oct 15 2016 02:21
Thanks!
Coy Sanders
@coymeetsworld
Oct 15 2016 02:21
no problem :thumbsup:
Girzima
@Girzima
Oct 15 2016 02:21
@iCantCodeYet margin-right:500px;
don't do this
Coy Sanders
@coymeetsworld
Oct 15 2016 02:21
@mailmesriza98 text needs to be as they say
Sriza Sen
@mailmesriza98
Oct 15 2016 02:22
I did that
Coy Sanders
@coymeetsworld
Oct 15 2016 02:22
no, should be #left-well not #left well
Sriza Sen
@mailmesriza98
Oct 15 2016 02:22
Oh okk thanks
Coy Sanders
@coymeetsworld
Oct 15 2016 02:22
has to be exact
yw
Girzima
@Girzima
Oct 15 2016 02:22
@iCantCodeYet remove #linkref from css
Riyuno
@iCantCodeYet
Oct 15 2016 02:22
ok
Girzima
@Girzima
Oct 15 2016 02:23
This message was deleted
#links {   
    float:right;
    height:100%;
    background-color:white;
    line-height:65px;
}
#links a{
  padding:30px 20px;
  text-decoration:none;
  color:black;
}
add this
bria
@Jahbria
Oct 15 2016 02:24

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

<img sr class = "smaller-image">
can some help me with this please

Coy Sanders
@coymeetsworld
Oct 15 2016 02:24
not sure what the sr is
but you don't need that 2nd img tag
you should be applying smaller-image class to the img you already have
Riyuno
@iCantCodeYet
Oct 15 2016 02:25
@Girzima ok
bria
@Jahbria
Oct 15 2016 02:26
@coymeetsworld i still don't get it
Coy Sanders
@coymeetsworld
Oct 15 2016 02:26
remove the 2nd img tag
you should only have the one
bria
@Jahbria
Oct 15 2016 02:26
okay
Girzima
@Girzima
Oct 15 2016 02:26
@iCantCodeYet Did my code work for you?
Coy Sanders
@coymeetsworld
Oct 15 2016 02:26
then, with the img tag you already have give that the smaller-image class
Riyuno
@iCantCodeYet
Oct 15 2016 02:27
the links are bigger than the navbar itself and they are on the right side, i need them in the middle :/
coder-97
@coder-97
Oct 15 2016 02:28
Can somebody help. It is telling me to nest my text input element within a form element
https://www.freecodecamp.com/challenges/create-a-form-element#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%3Cul%3E%0A%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%3Col%3E%0A%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%3C%2Fol%3E%0A%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%3E%0A%0A%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%3E%3C%2Fform%3E%0A%0A%0A%0A%0A%0A%0A%0A%0A
Girzima
@Girzima
Oct 15 2016 02:28
how the hell did it get pushed from the top
coder-97
@coder-97
Oct 15 2016 02:28
Is it similar to creating anchor texts?
bria
@Jahbria
Oct 15 2016 02:29
@coymeetsworld where am i suppose to put "smaller image"
Coy Sanders
@coymeetsworld
Oct 15 2016 02:29
in img tag @Jahbria
yes @coder-97, at least the nesting part
input tag should be between the form tags
Riyuno
@iCantCodeYet
Oct 15 2016 02:31
@Girzima my bad, now it isnt pushed from ht etop
Girzima
@Girzima
Oct 15 2016 02:31

@iCantCodeYet remove #linkref {
text-decoration: none;
color:black;
padding: 15px;
text-align:center;
float:right;
padding-right:30px;
display:inline-block;
width:80px;
margin-bottom:none;
background-color:white;

}

also change the padding on #links a to padding:20px;
Marcellana
@Marcellana
Oct 15 2016 02:33
Wow so hard @coder-97
Riyuno
@iCantCodeYet
Oct 15 2016 02:33
done
@Girzima
Marcellana
@Marcellana
Oct 15 2016 02:34
Someone help me?
Thomas Noe
@t3h2mas
Oct 15 2016 02:34
with?
coder-97
@coder-97
Oct 15 2016 02:35
@coymeetsworld oh okThank You
Coy Sanders
@coymeetsworld
Oct 15 2016 02:35
yw
coder-97
@coder-97
Oct 15 2016 02:36
@Marcellana I keep overthinking the problem when it has a simple solution
Girzima
@Girzima
Oct 15 2016 02:36
@iCantCodeYet I can't do much more to make it better without rewriting it. It isn't screen responsive and won't be without a lot of work
Riyuno
@iCantCodeYet
Oct 15 2016 02:37
why is it bad using margin-right:500px; @Girzima ?
Girzima
@Girzima
Oct 15 2016 02:38
@iCantCodeYet Because if you put the screen a different size it will look like poop. Assuming you don't care and you just want content to overflow, it's not a problem
Jer
@th8tawavez
Oct 15 2016 02:38
I need help, spent a couple of days away regrettably and forgot how to do a few things. I am on the section "Traget the same element with multiple jQuery Selectors" I have to add an animated button class, a shake class to all the buttons with class .btn, and add the btn-primary class to the button with the id #target1. Can you someone help me do this to review.
below is my code

<script>
$(document).ready(function() {

});
</script>

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target" id="target1">#target1</button>
<button class="btn btn-default target" id="target2">#target2</button>
<button class="btn btn-default target" id="target3">#target3</button>
</div>
</div>
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target" id="target4">#target4</button>
<button class="btn btn-default target" id="target5">#target5</button>
<button class="btn btn-default target" id="target6">#target6</button>
</div>
</div>
</div>
</div>

Riyuno
@iCantCodeYet
Oct 15 2016 02:40
i hope i will be able to understand that shit someday @Girzima
Coy Sanders
@coymeetsworld
Oct 15 2016 02:43
theres descriptions on the side of the challenges @th8tawavez that should get you started
but the format is $('selector').addClass('yourclass');
you can select html elements, classes or ids
arias93jordy
@arias93jordy
Oct 15 2016 02:45
This message was deleted
Jer
@th8tawavez
Oct 15 2016 02:46
@coymeetsworld ok thanks can you just give me an example of one
CamperBot
@camperbot
Oct 15 2016 02:46
th8tawavez sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1448 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
John Godwin
@JohnalphaFox
Oct 15 2016 02:49
gotta code em all
Jer
@th8tawavez
Oct 15 2016 02:50
i know but i have the format wrong
im doing it like this $("button").addclass(animated)
is it an equal sign and not ()
Aleksandra Barecka
@OlkaB
Oct 15 2016 02:51
Hi All, I need your help. I'm doing my portfolio exerecise (using flexbox) and when I resize screen to 418 px or lower the horizontal scrolling bar pup up and I get white space on the right. What is wrong in the code and how can I fix it? Here is my pen: http://codepen.io/OlkaB/pen/qayYRx
Jer
@th8tawavez
Oct 15 2016 02:51
do i do it inside the $(document)???
John Godwin
@JohnalphaFox
Oct 15 2016 02:52
self-thaught?
arias93jordy
@arias93jordy
Oct 15 2016 02:52
I'm in the section "change text inside an element using jQuery "i need to ,"Change the button with id target4 by emphasizing its text." and this is what I got so far :$("#taraget4").html("#target4"); the part I dont understand is where is asking me to emphasize the text by adding html tags inside the .html() function, but I dont know which tag I should use?
Jer
@th8tawavez
Oct 15 2016 02:55
@JohnalphaFox who are you asking?
Janina Pohorecki
@janepohorecka
Oct 15 2016 02:55
Would anyone here like to do some pair programming? Html/css/javascript?
Liam Read
@LiamDotPro
Oct 15 2016 02:55
@arias93jordy if it's asking you to change text inside an element you'll probably want to do something like $("#target4").text("text here");
John Godwin
@JohnalphaFox
Oct 15 2016 02:56
nothing bro u carry on
Liam Read
@LiamDotPro
Oct 15 2016 02:56
@arias93jordy and where it's asking you to emphasis the text it's probably looking for you to add some form of style inline to the html property
John Godwin
@JohnalphaFox
Oct 15 2016 02:56
@janepohorecka yuo
we can
Janina Pohorecki
@janepohorecka
Oct 15 2016 02:57
@JohnalphaFox awesome :) Let me private message you.
arias93jordy
@arias93jordy
Oct 15 2016 02:59
@LiamDotPro on this one the text can't be changed. instead of using .text , I need to use .html(), but one of the requirements is to add html tags like this example : $("h3").html("<em>jQuery Playground</em>");
Jer
@th8tawavez
Oct 15 2016 02:59
what am i doing wrong it says only add one class with each of your three selectors
<script>
$(document).ready(function() {

});
$("button").addClass="animated"
$(".btn").addClass="shake"
$("#target1").addClass="animated shake btn-primary"
</script>
Thomas Noe
@t3h2mas
Oct 15 2016 02:59
i think
addClass is a function
Manish Giri
@Manish-Giri
Oct 15 2016 03:00
@th8tawavez
$("button").addClass(“animated”);
@th8tawavez you pass in the class name like this, not with =
Jer
@th8tawavez
Oct 15 2016 03:00
oh ok thanks
@Manish-Giri thanks
CamperBot
@camperbot
Oct 15 2016 03:00
th8tawavez sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 1983 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Oct 15 2016 03:00
and the last selector should have just btn-primary class
Liam Read
@LiamDotPro
Oct 15 2016 03:00
@arias93jordy I sent you a pm
bria
@Jahbria
Oct 15 2016 03:01
Can someone help me with this please!!

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100px;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " class= thick-green-border>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Liam Read
@LiamDotPro
Oct 15 2016 03:01
@Jahbria whats the issue?
bria
@Jahbria
Oct 15 2016 03:02
i can't get the border around the image @LiamDotPro
and its width ad style
Liam Read
@LiamDotPro
Oct 15 2016 03:02
you have used class twice here @Jahbria
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " class= thick-green-border>
With css class if you wish to apply two classes you simply type the first then a space and another and so forth
example class="smaller-image thick-green-border"
Rihards
@kodetajs
Oct 15 2016 03:03
<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
bria
@Jahbria
Oct 15 2016 03:04
can you give me an example of having multiple classes @LiamDotPro
Girzima
@Girzima
Oct 15 2016 03:04
@Jahbria class="class1 class2 class3"
Liam Read
@LiamDotPro
Oct 15 2016 03:04
@Jahbria rihards beat me to the punch ;-)
Rihards
@kodetajs
Oct 15 2016 03:04
:D
bria
@Jahbria
Oct 15 2016 03:04
okay thanks guys
John Godwin
@JohnalphaFox
Oct 15 2016 03:06

Here, we can see that the green box and the red box are nested within the yellow box. Note that the red box has more margin than the green box, making it appear smaller.

When you increase the green box's margin, it will increase the distance between its border and surrounding elements.

Change the margin of the green box to match that of the red box.

hey help.....plese
Rihards
@kodetajs
Oct 15 2016 03:06
I just started. I even dont know what means many off all these commands and what they do :D But logical thinking is helping
John Godwin
@JohnalphaFox
Oct 15 2016 03:07
i did this but i didi't quite understand it......
bria
@Jahbria
Oct 15 2016 03:07
so would i do this : <img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " class1= thick-green-border>
John Godwin
@JohnalphaFox
Oct 15 2016 03:07
@kodetajs kudus bro
Rihards
@kodetajs
Oct 15 2016 03:07
It was easy
set the same margin to green box
Dylan
@dhcodes
Oct 15 2016 03:08
@Jahbria you only need to write the class keyword once, and then separate classes with a space
ex. class="class1 class2"
bria
@Jahbria
Oct 15 2016 03:09
okay thanks @dhcodes
CamperBot
@camperbot
Oct 15 2016 03:09
jahbria sends brownie points to @dhcodes :sparkles: :thumbsup: :sparkles:
:star2: 1492 | @dhcodes |http://www.freecodecamp.com/dhcodes
Rihards
@kodetajs
Oct 15 2016 03:09
@JohnalphaFox set the same margin to green box, if i remember corectly it was 20px or 10 px
John Godwin
@JohnalphaFox
Oct 15 2016 03:10
yhaa i did it but i didt understand it
how is it changed
bria
@Jahbria
Oct 15 2016 03:14
i tried this but it still wouldn't work: <img class= "smaller-image" class1 thick-green-border src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " class1= thick-green-border>
Girzima
@Girzima
Oct 15 2016 03:15
lol
Liam Read
@LiamDotPro
Oct 15 2016 03:15
@Jahbria <img class= "smaller-image class1 thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " class1= thick-green-border>
_
@Jahbria You have missplaced the " on the class property of your html element :-)
bria
@Jahbria
Oct 15 2016 03:16
ohh okay thanks for thanks for the help
Liam Read
@LiamDotPro
Oct 15 2016 03:16
@Jahbria you can also remove the class1 at the end of your element as well ^_^
bria
@Jahbria
Oct 15 2016 03:16
okay
Liam Read
@LiamDotPro
Oct 15 2016 03:17
<img class= "smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. " >
@Jahbria How are we doing? :-)
Jake
@zatr1997
Oct 15 2016 03:35
Code won't pass. Image sizing issue. Code is formatted exactly as it dictates me to do
Here's my code:

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.smaller-image {
width: 100px;
}
.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Yasser Hussain
@yasserhussain1110
Oct 15 2016 03:38
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.smaller-image {
width: 100px;
}
.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
this looks better doesn't it @zatr1997
Liam Read
@LiamDotPro
Oct 15 2016 03:39
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
@zatr1997 I think you may have forgotten to apply the class to the image above :-)
Yasser Hussain
@yasserhussain1110
Oct 15 2016 03:40
yup that's it
Thomas Mullen
@t-mullen
Oct 15 2016 03:40
Paying a brownie debt! Thanks @janepohorecka
CamperBot
@camperbot
Oct 15 2016 03:40
rationalcoding sends brownie points to @janepohorecka :sparkles: :thumbsup: :sparkles:
:cookie: 230 | @janepohorecka |http://www.freecodecamp.com/janepohorecka
Jake
@zatr1997
Oct 15 2016 03:40
Thanks guys!!
Yasser Hussain
@yasserhussain1110
Oct 15 2016 03:40
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
Liam Read
@LiamDotPro
Oct 15 2016 03:40
@zatr1997 No worries man :-)
Can someone explain to me what brownie points are for?
Thomas Mullen
@t-mullen
Oct 15 2016 03:43
@LiamDotPro Fame and glory
The legend holds that if one collects 1 million brownie points, he/she will ascend to programmer godhood
Liam Read
@LiamDotPro
Oct 15 2016 03:44
@RationalCoding how do I collect many internet fame points :D
Thomas Mullen
@t-mullen
Oct 15 2016 03:44
People say "thanks" to you.
or "thank you"
probably a bunch of other phrases too
Liam Read
@LiamDotPro
Oct 15 2016 03:45
@RationalCoding awesome stuff
@RationalCoding You work for IBM?
Thomas Mullen
@t-mullen
Oct 15 2016 03:45
But they're actually useless haha
Yup
For an internship at least
Liam Read
@LiamDotPro
Oct 15 2016 03:46
@RationalCoding Neat, do they have free drinks?
Jake
@zatr1997
Oct 15 2016 03:46
@LiamDotPro weird still not working
Thomas Mullen
@t-mullen
Oct 15 2016 03:46
Nope
Jake
@zatr1997
Oct 15 2016 03:46

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.smaller.image {
width: 100px;
}

.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

New code
Liam Read
@LiamDotPro
Oct 15 2016 03:46
.smaller.image { width: 100px; }
I beileve your after a - there :-)
Thomas Mullen
@t-mullen
Oct 15 2016 03:47
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.smaller.image {
width: 100px;
}

.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
Sorry, I can't read unformatted code for the life of me.
Liam Read
@LiamDotPro
Oct 15 2016 03:47
@RationalCoding a while ago I did an internship at microsoft we got free drinks
@RationalCoding I still have no idea how to format code here like that, spill the beans friend
Thomas Mullen
@t-mullen
Oct 15 2016 03:47
```
UR CODE
```
I escaped it, so you can see it
If you want to get really fancy and add syntax hightlight.
```html
UR CODe
```
Liam Read
@LiamDotPro
Oct 15 2016 03:48
var life = function(todos){ var machine = life;}
Thomas Mullen
@t-mullen
Oct 15 2016 03:48
Or javascript, python whatever
Liam Read
@LiamDotPro
Oct 15 2016 03:48
Nice
@RationalCoding this hyperhost stuff looks pretty neat
Thomas Mullen
@t-mullen
Oct 15 2016 03:50
Yeah it's my most useful project for sure
Free hosting, what's not to love.
Liam Read
@LiamDotPro
Oct 15 2016 03:51
@RationalCoding that upcoming feature looks mint mate, the distributed hosting one
Thomas Mullen
@t-mullen
Oct 15 2016 03:51
Oh yeah? You think I should get on that?
There's lots of issues with privacy and not being able to trust the rehosters though.
Puts more load on the server to keep track of the hosting trees too
Liam Read
@LiamDotPro
Oct 15 2016 03:53
@RationalCoding I mean for demoing stuff and hackathons it'd be neat,
Thomas Mullen
@t-mullen
Oct 15 2016 03:53
That's what it's for yeah. Not sure how many more features it really needs.
Inopo
@Inopo
Oct 15 2016 03:53
Hi, thanks a lot, I have used an example here
Thomas Mullen
@t-mullen
Oct 15 2016 03:53
Although Heroku is so easy to deploy to these days.
Liam Read
@LiamDotPro
Oct 15 2016 03:53
ahh yeah the privacy one is a bit of a kicker, I just think it's an awesome concept
Inopo
@Inopo
Oct 15 2016 03:54
But how on earth I should have guessed using .smaller.image class..
Liam Read
@LiamDotPro
Oct 15 2016 03:54
@Inopo shouldn't it be .smaller-image?
Inopo
@Inopo
Oct 15 2016 03:55
.smaller.image is the one I used and it worked
Liam Read
@LiamDotPro
Oct 15 2016 03:55
What's the name of the lesson this is from? I'll go check it out
mbillard11
@mbillard11
Oct 15 2016 03:58
Hey guys, Im having some trouble with the "Target the same element with multiple jQuery Selectors" lesson
Liam Read
@LiamDotPro
Oct 15 2016 03:58
@mbillard11 What's it asking you to do? :-)
mbillard11
@mbillard11
Oct 15 2016 03:59
You should only be targeting one element and adding only one class at a time. Altogether, your three individual selectors will end up adding the three classes shake, animated, and btn-primary to #target1.
and i have this
<script>
$(document).ready(function() {
$("button").addClass("animated");
$(".btn").addClass("shake");
$("#target1").addclass("btn-primary");
});
</script>
plus more below obviously
Liam Read
@LiamDotPro
Oct 15 2016 04:00
$(".btn").addClass("shake"); this looks like it should be an id rather than a class unless you have multiple buttons
<script>
  $(document).ready(function() {
    $("#target1").addClass("animated");
    $("#target1").addClass("shake");
    $("#target1").addclass("btn-primary");
  });
</script>
mbillard11
@mbillard11
Oct 15 2016 04:01
nope it should be a class i believe, i have 6 buttons
Liam Read
@LiamDotPro
Oct 15 2016 04:01
ahh wait
I think I misread the question
mbillard11
@mbillard11
Oct 15 2016 04:01
it wants me to use the selectors to add a class to elements of type button, class .btn and id #target1
LydaTech
@lydatech
Oct 15 2016 04:02
@mbillard11
$(document).ready(function() {
    $("button").addClass("animated");
    $(".btn").addClass("shake");
    $("#target1").addClass("btn-primary");

  });
@mbillard11 is the correct answer
mbillard11
@mbillard11
Oct 15 2016 04:03
@lydatech Thats what I have
LydaTech
@lydatech
Oct 15 2016 04:03
@mbillard11 did you change anything else in the code?
mbillard11
@mbillard11
Oct 15 2016 04:04
No i dont believe, i reset it and thats all i added to the code
<script>
  $(document).ready(function() {
    $("button").addClass("animated");
    $(".btn").addClass("shake");
    $("#target1").addclass("btn-primary");
  });
</script>
LydaTech
@lydatech
Oct 15 2016 04:05
@mbillard11 click the link im going to send and run the test code button
https://www.freecodecamp.com/challenges/target-the-same-element-with-multiple-jquery-selectors#?solution=%0Afccss%0A%20%20%24(document).ready(function()%20%7B%0A%20%20%20%20%24(%22button%22).addClass(%22animated%22)%3B%0A%20%20%20%20%24(%22.btn%22).addClass(%22shake%22)%3B%0A%20%20%20%20%24(%22%23target1%22).addClass(%22btn-primary%22)%3B%0A%0A%20%20%7D)%3B%0Afcces%0A%0A%3C!--%20Only%20change%20code%20above%20this%20line.%20--%3E%0A%0A%3Cdiv%20class%3D%22container-fluid%22%3E%0A%20%20%3Ch3%20class%3D%22text-primary%20text-center%22%3EjQuery%20Playground%3C%2Fh3%3E%0A%20%20%3Cdiv%20class%3D%22row%22%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%3Ch4%3E%23left-well%3C%2Fh4%3E%0A%20%20%20%20%20%20%3Cdiv%20class%3D%22well%22%20id%3D%22left-well%22%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target1%22%3E%23target1%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target2%22%3E%23target2%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target3%22%3E%23target3%3C%2Fbutton%3E%0A%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3Cdiv%20class%3D%22col-xs-6%22%3E%0A%20%20%20%20%20%20%3Ch4%3E%23right-well%3C%2Fh4%3E%0A%20%20%20%20%20%20%3Cdiv%20class%3D%22well%22%20id%3D%22right-well%22%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target4%22%3E%23target4%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target5%22%3E%23target5%3C%2Fbutton%3E%0A%20%20%20%20%20%20%20%20%3Cbutton%20class%3D%22btn%20btn-default%20target%22%20id%3D%22target6%22%3E%23target6%3C%2Fbutton%3E%0A%20%20%20%20%20%20%3C%2Fdiv%3E%0A%20%20%20%20%3C%2Fdiv%3E%0A%20%20%3C%2Fdiv%3E%0A%3C%2Fdiv%3E%0A
mbillard11
@mbillard11
Oct 15 2016 04:05
@lydatech Yup that worked for me
Oh
i had .addclass on one
not .addClass
LydaTech
@lydatech
Oct 15 2016 04:07
That would do it
mbillard11
@mbillard11
Oct 15 2016 04:07
Thanks a lot guys
@lydatech Thanks
CamperBot
@camperbot
Oct 15 2016 04:07
mbillard11 sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 1218 | @lydatech |http://www.freecodecamp.com/lydatech
mbillard11
@mbillard11
Oct 15 2016 04:07
@LiamDotPro Thanks
CamperBot
@camperbot
Oct 15 2016 04:07
mbillard11 sends brownie points to @liamdotpro :sparkles: :thumbsup: :sparkles:
:cookie: 15 | @liamdotpro |http://www.freecodecamp.com/liamdotpro
Liam Read
@LiamDotPro
Oct 15 2016 04:08
@mbillard11 cheers boss :-)
Ruth Walther
@RuthWalther
Oct 15 2016 04:15
hello
Liam Read
@LiamDotPro
Oct 15 2016 04:15
@RuthWalther Hey there
Ruth Walther
@RuthWalther
Oct 15 2016 04:15
I just started FreeCodeCamp
Hi @LiamDotPro
Pravin Shinde
@prawin007
Oct 15 2016 04:16

<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target4").html("<em> #target4 </em>");

});
</script>

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target" id="target1">#target1</button>
<button class="btn btn-default target" id="target2">#target2</button>
<button class="btn btn-default target" id="target3">#target3</button>
</div>
</div>
<div class="col-xs-6">
<h4>#right-well</h4>
<div class="well" id="right-well">
<button class="btn btn-default target" id="target4">#target4</button>
<button class="btn btn-default target" id="target5">#target5</button>
<button class="btn btn-default target" id="target6">#target6</button>
</div>
</div>
</div>
</div>

error on line no 3
Liam Read
@LiamDotPro
Oct 15 2016 04:16
@RuthWalther welcome aboard :D
@prawin007 what is the test asking you to do?
I'm presuming it's just changing the buttons text color to red?
Pravin Shinde
@prawin007
Oct 15 2016 04:18
change the text inside an element using jquery
Liam Read
@LiamDotPro
Oct 15 2016 04:18
Oh so line 4?
Pravin Shinde
@prawin007
Oct 15 2016 04:18
yes
Liam Read
@LiamDotPro
Oct 15 2016 04:19
Could you copy and paste the link you have to the lesson?
Santos
@sreyesx23
Oct 15 2016 04:19
I need help with the rgb colors. I've changed the colors to what it is asking me, but for some reason i can't move on
Thomas Mullen
@t-mullen
Oct 15 2016 04:21
@sreyesx23 Mind posting what you have so far?
Joy
@poemul7
Oct 15 2016 04:25
hello everyone trying to override the other declarations but can't figure out what's wrong with <h1 id="orange-text" class="pink-text blue-text" style="white">Hello World!</h1>
CamperBot
@camperbot
Oct 15 2016 04:25

welcome to FreeCodeCamp @poemul7!

Liam Read
@LiamDotPro
Oct 15 2016 04:25
@prawin007 ```
<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target4").html("<em>#target4</em>");
  });
</script>
That works for me :-)
Santos
@sreyesx23
Oct 15 2016 04:25
This message was deleted
This message was deleted
Joy
@poemul7
Oct 15 2016 04:26
actually had style="color: white"
Liam Read
@LiamDotPro
Oct 15 2016 04:26
style="color: white;"
Santos
@sreyesx23
Oct 15 2016 04:27
This message was deleted
Thomas Mullen
@t-mullen
Oct 15 2016 04:27
?
Liam Read
@LiamDotPro
Oct 15 2016 04:27
@poemul7 You are missing a line ending ; in the above, though sometimes inline lets you get away with it
Santos
@sreyesx23
Oct 15 2016 04:27
This message was deleted
Liam Read
@LiamDotPro
Oct 15 2016 04:29
@poemul7 here's a code pen to have a look at with some sample code http://codepen.io/anon/pen/QKBzkN
lance a wilson
@Biggbuz1
Oct 15 2016 04:29
hi
Liam Read
@LiamDotPro
Oct 15 2016 04:29
@Biggbuz1 Hey there
Santos
@sreyesx23
Oct 15 2016 04:30
@RationalCoding
It is asking me to do this
.Blue-Text { color: rgb(0, 0, 255)}
But there is an X still for, "Use rub for the color blue."
RGB*
Thomas Mullen
@t-mullen
Oct 15 2016 04:31
Maybe you have to set background-color or border-color?
What's your full solution?
Santos
@sreyesx23
Oct 15 2016 04:31
How do you send a screenshot on here?
Thomas Mullen
@t-mullen
Oct 15 2016 04:32
The link at the top of the FCC page will link us to your solution
@sreyesx23
This message was deleted
You need a lower-case b
  .blue-text {
    color: rgb(0,0,255);
  }
Alexey Bakhtin-Bibikov
@Hawkite
Oct 15 2016 04:35
Does anybody here have experience with the pug/jade templating engine?
Liam Read
@LiamDotPro
Oct 15 2016 04:35
@RationalCoding your website is pretty neat, getting that hacker vibe fo reals
Thomas Mullen
@t-mullen
Oct 15 2016 04:36
@LiamDotPro Thanks:) I watch a lot of mr.robot before making it haha
CamperBot
@camperbot
Oct 15 2016 04:36
rationalcoding sends brownie points to @liamdotpro :sparkles: :thumbsup: :sparkles:
:cookie: 24 | @liamdotpro |http://www.freecodecamp.com/liamdotpro
Santos
@sreyesx23
Oct 15 2016 04:36
The b is lower case, also its not asking for hex. That was about 3 challenges ago. now it wants the RGB values for the text. Its the last challenge before hitting the first 5 hour mark in html. @RationalCoding
Liam Read
@LiamDotPro
Oct 15 2016 04:37
@RationalCoding The chat thing is really unique, nice touch for sure. Though wordpress for your blog? It's like a right of passage coding a blogging system haha
Thomas Mullen
@t-mullen
Oct 15 2016 04:38
@sreyesx23 I know, I corrected my message. Not sure what's going on with your code then.
Thomas Mullen
@t-mullen
Oct 15 2016 04:39
<style>
  .red-text {
    color:rgb(255, 0, 0);
  }
  .orchid-text {
    color:     rgb(218, 112, 214);
  }
  .sienna-text {
    color:rgb(160, 82, 45);
  }
  .blue-text {
    color: rgb(0, 0, 255);
  }
</style>

<h1 class="red-text">I am red!</h1>

<h1 class="orchid-text">I am orchid!</h1>

<h1 class="sienna-text">I am sienna!</h1>

<h1 class="blue-text">I am blue!</h1>
This passed for me :thumbsup:
Don't copy paste though! try to figure out the difference.
Ryan Jankovich
@JanksPLG
Oct 15 2016 04:39
this is basic but how do i keep h1 and p not visible if i have to end the comments with -->
Thomas Mullen
@t-mullen
Oct 15 2016 04:39
@LiamDotPro I was testing to see if a blog would be worth my time
I think the blog is getting dropped tbh
Writing in english isn't my thing
Liam Read
@LiamDotPro
Oct 15 2016 04:40
@JanksPLG <!-- content --> stuff always follows that pattern
Thomas Mullen
@t-mullen
Oct 15 2016 04:40
@JanksPLG What do you mean?
--> won't end your tag
Liam Read
@LiamDotPro
Oct 15 2016 04:40
@RationalCoding I love the idea of blogs though I can never justify writing large articles sometimes
Thomas Mullen
@t-mullen
Oct 15 2016 04:41
If it's proceeded by <!--
@LiamDotPro It takes far too much time.
Ryan Jankovich
@JanksPLG
Oct 15 2016 04:42
I have to comment out h1 and p elements so they are not visible, but i'm not sure how to do that because it say I have to end comments with --> but that makes it visible
Santos
@sreyesx23
Oct 15 2016 04:42
I was missing the semicolons.... thanks though! @RationalCoding
CamperBot
@camperbot
Oct 15 2016 04:42
sreyesx23 sends brownie points to @rationalcoding :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @rationalcoding |http://www.freecodecamp.com/rationalcoding
Liam Read
@LiamDotPro
Oct 15 2016 04:42
@JanksPLG Your misinterpreting the pattern of how comments work pal
Michael Edore
@smichaeledore
Oct 15 2016 04:43
@JanksPLG @JanksPLG <!-- comment out-->
then the text
Liam Read
@LiamDotPro
Oct 15 2016 04:43
//works
<!--- foo -->

//fails
<!--bar
Michael Edore
@smichaeledore
Oct 15 2016 04:44
Ryan Jankovich
@JanksPLG
Oct 15 2016 04:44
ok thanks
Thomas Mullen
@t-mullen
Oct 15 2016 04:44
Bye blog!
Liam Read
@LiamDotPro
Oct 15 2016 04:45
@RationalCoding Either-way it's all about sending ascii art in the console these days
http://www.method.gg/ check the console on this website ^_^
Joy
@poemul7
Oct 15 2016 04:48
<h1 id="orange-text" class="pink-text blue-text" style="color: white">Hello World!</h1> how can I add !important to the pink-text class declaration to override all other declarations?
Liam Read
@LiamDotPro
Oct 15 2016 04:49
.myClass{
color: blue !important;
}
@poemul7
@RationalCoding I really wish I would find more interesting projects like yours, like I've checked a few out now that are super useful
this tethys one is actually something I might try out with the team as we've always been looking for a free live editor for collaboration
does it support PHP?
Thomas Mullen
@t-mullen
Oct 15 2016 04:54
@LiamDotPro I can add the CodeMirror highlighting rn if you want PHP
It's only two lines
It's a big finicky if two people are typing at the same time, so I wouldn't consider it done yet.
Liam Read
@LiamDotPro
Oct 15 2016 04:55
@RationalCoding That would be great, give it a test tomorrow with the boys :-)
Thomas Mullen
@t-mullen
Oct 15 2016 04:55
But if you're working on diff files it's fine
Let me know all the bugs you'll inevitably find lol
Joy
@poemul7
Oct 15 2016 04:56
@LiamDotPro merci bcp
Liam Read
@LiamDotPro
Oct 15 2016 04:56
@poemul7 no problems :-)
Rihards
@kodetajs
Oct 15 2016 04:56

Can someone help please!
Change Text Inside an Element Using jQuery
Change the button with id target4 by emphasizing its text.

<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target4").html("<em>#target4</em>");
});
</script>

just dont work, i cant understandt this

Emphasize the text in your target4 button by adding HTML tags.

Liam Read
@LiamDotPro
Oct 15 2016 04:56
@RationalCoding yeah for sure, I'm actually quite intrested in building something like this for my final year project
Rihards
@kodetajs
Oct 15 2016 04:57
mother google didnt help :D
Liam Read
@LiamDotPro
Oct 15 2016 04:58
@kodetajs If you haven't changed the html this should work
<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target4").html("<em>#target4</em>");
  });
</script>
@kodetajs This passed for me earlier
which looks identical to yours
Rihards
@kodetajs
Oct 15 2016 05:00
lol i was thinking and looking for information about 1 hour and forgot just psuh the buttons ctr+enter :D
@LiamDotPro Thanks
CamperBot
@camperbot
Oct 15 2016 05:00
kodetajs sends brownie points to @liamdotpro :sparkles: :thumbsup: :sparkles:
:cookie: 25 | @liamdotpro |http://www.freecodecamp.com/liamdotpro
Liam Read
@LiamDotPro
Oct 15 2016 05:00
haha no problem @kodetajs
@RationalCoding I'll be following you on github, I'll shoot you and email of any bugs I find! night guys.
jonrussell5
@jonrussell5
Oct 15 2016 05:05
Your h2 element should use the font Lobster. Help please
Liam Read
@LiamDotPro
Oct 15 2016 05:06
@jonrussell5 you need to create a class using h2{} and assign the font as lobster
@jonrussell5 this is quite simple so if you read the help text you'll get there
Thomas Mullen
@t-mullen
Oct 15 2016 05:06
@LiamDotPro Seems CodeMirror has some issues with PHP upstream. But what does work is there
You won't be able to deploy though, HyperHost is just Node.js
Liam Read
@LiamDotPro
Oct 15 2016 05:07
@RationalCoding thanks man, I'll have a play around with it
CamperBot
@camperbot
Oct 15 2016 05:07
liamdotpro sends brownie points to @rationalcoding :sparkles: :thumbsup: :sparkles:
:cookie: 268 | @rationalcoding |http://www.freecodecamp.com/rationalcoding
Thomas Mullen
@t-mullen
Oct 15 2016 05:07
Imma get fat on all these brownies bro :p
Liam Read
@LiamDotPro
Oct 15 2016 05:09
I might speed run one of these challenges that take 250 hours
could be some fun for a day
though coding outside of an ide is a pain
Thomas Mullen
@t-mullen
Oct 15 2016 05:10
IKR. I've been thinking about making a Codepen extension for Atom or Brackets
But that's a huge amount of work and I don't think many people would use it
After all, you can just copy-paste three times.
Liam Read
@LiamDotPro
Oct 15 2016 05:11
Yeah copy and pasting is easyier which kinda kills the idea still cool though
as bad as this sounds I really like netbeans
I use it for everything PHP, JS, java
Brototi Biswas
@Meghh
Oct 15 2016 05:12
Hi I need help with how to add form-control class in form's text input field and adding "btn btn-primary" to Submit button.I'm not sure what I'm doing wrong in this. alt
Yugandhar Bonde
@Yugandhar123
Oct 15 2016 05:12
<a href="#"> <img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera."/>
</a>
Brototi Biswas
@Meghh
Oct 15 2016 05:12
<form action="/submit-cat-photo form-control">
<div class="row">
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
</div>
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
</div>
</div>
<div class="row">
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Loving</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Lazy</label>
</div>
<div class="col-xs-4">
<label><input type="checkbox" name="personality"> Crazy</label>
</div>
</div>
<input type="text" placeholder="cat photo URL" required>
<button type="btn btn-primary"><i class="fa fa-paper-plane"> </i>Submit</button>
</form>
</div>
Yugandhar Bonde
@Yugandhar123
Oct 15 2016 05:12
What's wrong with this syntax?
cqlin1995
@cqlin1995
Oct 15 2016 05:13
the text submit should be surrounded by <i>and</i>
blob
Sahil Kumar
@rinpasahil333
Oct 15 2016 05:16
😕.
Brototi Biswas
@Meghh
Oct 15 2016 05:16
alright i figured out what went wrong with the button.but i'm still confused with the "form-control" thing
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:19
@Meghh it needs to be a class, not an action
class="form-control"
<form action="/submit-cat-photo" class="form-control">
Brototi Biswas
@Meghh
Oct 15 2016 05:21
thank you.got it.
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:21
@Meghh :+1:
Haydenmarx
@Haydenmarx
Oct 15 2016 05:21
Can someone help me make this not be an infinite loop? It's for the Pig Latin Problem.
function translatePigLatin(str) {
  var regEx =/[aeiou]/;
  var result =str;
  var firstLetter;
  while(!result[0].match(regEx =null)){
    firstLetter =result[0];
    result =str.split('');
    result.shift();
    result.push(firstLetter);
    result =result.join('');
  }
  result =result.split('');
  result.push("ay");
  result= result.join('');
  return result;
}

translatePigLatin("consonant");
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:22
@Haydenmarx the javascript help room may help you better
Haydenmarx
@Haydenmarx
Oct 15 2016 05:22
@ahmedtarek2134 thanks. I'll try there.
CamperBot
@camperbot
Oct 15 2016 05:22
haydenmarx sends brownie points to @ahmedtarek2134 :sparkles: :thumbsup: :sparkles:
:cookie: 443 | @ahmedtarek2134 |http://www.freecodecamp.com/ahmedtarek2134
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:22
@Haydenmarx :+1:
Tethi
@Tethi
Oct 15 2016 05:23
<label><input class ="btn" name='button'>Like</label>
alright guys i need help on this
Thomas Mullen
@t-mullen
Oct 15 2016 05:23
@Haydenmarx
while(!result[0].match(regEx =null)) you're setting the variable regEx to null here
Did you mean while(!(result[0].match(regEx) === null))
Tethi
@Tethi
Oct 15 2016 05:23
basically what is the button element for bootstrap is i guess what im missing
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:24
@Tethi you have a space after class
Allen
@Dash0665
Oct 15 2016 05:24
it askes for "Your a element should be a dead link with a href attribute set to "#"." and i put "<p>Click here for <a #="http://www.freecatphotoapp.com">cat photos</a>.</p>"
Tethi
@Tethi
Oct 15 2016 05:24
@ahmedtarek2134 yea it doesnt effect the overall code
no here lemme copy and paste this
stelecoms00
@stelecoms00
Oct 15 2016 05:25
what is the best IDE to use? I use atom but autocomplete doesnt work very well :(
Sahil Kumar
@rinpasahil333
Oct 15 2016 05:25
@allen try <a href="#">
Tethi
@Tethi
Oct 15 2016 05:25

Bootstrap has its own styles for button elements, which look much better than the plain HTML ones.

Create a new button element below your large kitten photo. Give it the class btn and the text of "Like".

Sahil Kumar
@rinpasahil333
Oct 15 2016 05:25
It will create a dead link
Haydenmarx
@Haydenmarx
Oct 15 2016 05:25
@RationalCoding Thanks. Forgot about that. Still looping through.
CamperBot
@camperbot
Oct 15 2016 05:25
haydenmarx sends brownie points to @rationalcoding :sparkles: :thumbsup: :sparkles:
:cookie: 269 | @rationalcoding |http://www.freecodecamp.com/rationalcoding
Allen
@Dash0665
Oct 15 2016 05:25
@rinpasahil333 okay
Tethi
@Tethi
Oct 15 2016 05:25
<label><input class="btn" name='button'>Like</label>
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:26
@stelecoms00 try Sublime text or if you do want something very good but for a price, try Webstorm
Tethi
@Tethi
Oct 15 2016 05:26
i know i either have the element wrong am writing the wrong code overall
stelecoms00
@stelecoms00
Oct 15 2016 05:27
Thanks Ahmed Tarek
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:27
@Tethi wait, create a new button element means <button></button>
Tethi
@Tethi
Oct 15 2016 05:28
@ahmedtarek2134 oh shoot lemme try that
Thomas Mullen
@t-mullen
Oct 15 2016 05:28
@Haydenmarx Works for me
function translatePigLatin(str) {
  var regEx =/[aeiou]/;
  var result =str;
  var firstLetter;
  while(!(result[0].match(regEx) ===null)){ //<--
    firstLetter =result[0];
    result =str.split('');
    result.shift();
    result.push(firstLetter);
    result =result.join('');
  }
  result =result.split('');
  result.push("ay");
  result= result.join('');
  return result;
}
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:29
@Tethi <button class="btn">Like</button>
Tethi
@Tethi
Oct 15 2016 05:30
@ahmedtarek2134 BRO THANK YOU!! ive been on this forever tryna figure it out haha
CamperBot
@camperbot
Oct 15 2016 05:30
tethi sends brownie points to @ahmedtarek2134 :sparkles: :thumbsup: :sparkles:
:cookie: 444 | @ahmedtarek2134 |http://www.freecodecamp.com/ahmedtarek2134
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:30
@Tethi :smile: :+1:
Tethi
@Tethi
Oct 15 2016 05:30
@ahmedtarek2134 and thanks again!haha
CamperBot
@camperbot
Oct 15 2016 05:30
tethi sends brownie points to @ahmedtarek2134 :sparkles: :thumbsup: :sparkles:
:warning: tethi already gave ahmedtarek2134 points
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:31
guys any suggestions about what to code, I am bored
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:32
Responsively Style Radio Buttons
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:33
@FaheemAbuBakr radio buttons are the <input type="radio">
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:33
that was a typo lol sorry
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:33
:smile:
Haydenmarx
@Haydenmarx
Oct 15 2016 05:34
@RationalCoding
Ahmed Tarek
@ahmedtarek2134
Oct 15 2016 05:34
guys I will go now
cya all
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:34
@ahmedtarek2134 Im actually stuck on that too can you help me
Lazybones101
@lazybones101
Oct 15 2016 05:35

Not getting smaller image <style>
.red-text {
color: red;
}
.smaller-image {
width: 100px;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img class= "smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

Ge Nan
@GeNannnnn
Oct 15 2016 05:35
Add Font Awesome Icons to our Buttons
Haydenmarx
@Haydenmarx
Oct 15 2016 05:35
@RationalCoding
I fixed the null comparison, but it's still looping around line 7 for some reason.
function translatePigLatin(str) {
  var regEx =/[aeiou]/;
  var result =str;
  var firstLetter;
  while(result[0].match(regEx) !==null){
    firstLetter =result[0];
    result =str.split('');
    result.shift();
    result.push(firstLetter);
    result =result.join('');
  }
  result =result.split('');
  result.push("ay");
  result= result.join('');
  return result;
}

translatePigLatin("eight");
Ge Nan
@GeNannnnn
Oct 15 2016 05:35
how to do?
LydaTech
@lydatech
Oct 15 2016 05:36
@GeNannnnn font awesome is just a series of classes
added using the <i> tag
Ge Nan
@GeNannnnn
Oct 15 2016 05:37
@lydatech <button class="btn btn-block btn-primary"><i class="fa-thumbs-up">Like</i></button> yes or no ?
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:37
Can anyone help me Im stuck on Responsively Style Radio Buttons
LydaTech
@lydatech
Oct 15 2016 05:37
@GeNannnnn almost
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:38

<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>

<div class="row">
<div class="col-xs-6">
  <button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
</div>

<div class="row">
<div class="col-xs-6">
  <button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>

</div>
</div>

LydaTech
@lydatech
Oct 15 2016 05:38
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"> Like</i></button>
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:39

<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>

<div class="row">
<div class="col-xs-6">
  <button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
</div>

<div class="row">
<div class="col-xs-6">
  <button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>

</div>
</div>

Ge Nan
@GeNannnnn
Oct 15 2016 05:39
@lydatech Thank you!
CamperBot
@camperbot
Oct 15 2016 05:39
genannnnn sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 1220 | @lydatech |http://www.freecodecamp.com/lydatech
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:40
I dont know what I did wrong please help needed
LydaTech
@lydatech
Oct 15 2016 05:40
@FaheemAbuBakr what challenge
Thomas Mullen
@t-mullen
Oct 15 2016 05:41
@Haydenmarx You're also using str instead of your updated result
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:41
@lydatech Responsively Style Radio Buttons
Thomas Mullen
@t-mullen
Oct 15 2016 05:41
result =str.split(''); should be result =result.split('');
LydaTech
@lydatech
Oct 15 2016 05:42
@FaheemAbuBakr
  <form action="/submit-cat-photo">
    <div class="row">
      <div class="col-xs-6">
    <label><input type="radio" name="indoor-outdoor"> Indoor</label>
      </div>
      <div class="col-xs-6">
    <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
      </div>
    </div>
    <label><input type="checkbox" name="personality"> Loving</label>
    <label><input type="checkbox" name="personality"> Lazy</label>
    <label><input type="checkbox" name="personality"> Crazy</label>
    <input type="text" placeholder="cat photo URL" required>
    <button type="submit">Submit</button>
  </form>
Thomas Mullen
@t-mullen
Oct 15 2016 05:42
Doesn't hang anymore, but "eight" turns into "ghteiay".
Haydenmarx
@Haydenmarx
Oct 15 2016 05:43
@RationalCoding Thanks. That's what was causing the loop.
CamperBot
@camperbot
Oct 15 2016 05:43
:warning: haydenmarx already gave rationalcoding points
haydenmarx sends brownie points to @rationalcoding :sparkles: :thumbsup: :sparkles:
Haydenmarx
@Haydenmarx
Oct 15 2016 05:44
@RationalCoding Yes. I misunderstood the question a bit and will be working on adjusting it to fit how pig latin is supposed to work.
Faheem AbuBakr
@FaheemAbuBakr
Oct 15 2016 05:45
@lydatech Thank You sir
CamperBot
@camperbot
Oct 15 2016 05:45
faheemabubakr sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 1221 | @lydatech |http://www.freecodecamp.com/lydatech
Haydenmarx
@Haydenmarx
Oct 15 2016 05:51

@RationalCoding

It's not pretty, but it works now. Thanks for helping me catch the errors.


function translatePigLatin(str) {
  var regEx =/[aeiou]/;
  var result =str;
  var firstLetter;
  if(result[0].match(regEx) !==null){
    result =result.split('');
    result.push("w");
    result= result.join('');
  }
  while(result[0].match(regEx) ===null){
    firstLetter =result[0];
    result =result.split('');
    result.shift();
    result.push(firstLetter);
    result =result.join('');
  }
  result =result.split('');
  result.push("ay");
  result= result.join('');
  return result;
}

translatePigLatin("algorithm");
CamperBot
@camperbot
Oct 15 2016 05:51
haydenmarx sends brownie points to @rationalcoding :sparkles: :thumbsup: :sparkles:
:warning: haydenmarx already gave rationalcoding points
Nesredin Mustefa
@nesru
Oct 15 2016 05:55
the navbar coversthe content of my page. Padding works only for the first menu. Can anyone help?
Thomas Mullen
@t-mullen
Oct 15 2016 05:55
@Haydenmarx Sweet!
LydaTech
@lydatech
Oct 15 2016 05:58
@nesru need to see your code
Aleksandra Barecka
@OlkaB
Oct 15 2016 05:59
Hi All, I'm doing my portfolio exerecise (using flexbox) and when I resize screen to 418 px or lower the horizontal scrolling bar pup up and I get white space on the right of my content. I would appreciate any suggestion what is wrong in the code and how can I fix it? Here is my pen: http://codepen.io/OlkaB/pen/qayYRx
Nesredin Mustefa
@nesru
Oct 15 2016 05:59
<body >
<!-- Navigation Bar -->
<nav class="container-fluid navbar navbar-default navbar-fixed-top">
<div class="navbar-header">
<a class="navbar-brand">Nesru</a>
<button class="navbar-toggle" data-toggle="collapse" data-target="#navbar" type="button" aria-expanded='false'>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a class="active" href="#about" onclick="$('.navbar-toggle').click()">About</a></li>
<li><a href="#portfolio" onclick="$('.navbar-toggle').click()">Portfolio</a></li>
<li><a href="#contact" data-toggle="collapse" data-target=".navbar-collapse.in" class="nav-link">Contact</a></li>
</ul>
</div>
</nav>
  <!-- Content of the tabs-->
LydaTech
@lydatech
Oct 15 2016 06:00
@nesru dont you have that in a pen or anything?
Nesredin Mustefa
@nesru
Oct 15 2016 06:02
how do you post it in a pen?
LydaTech
@lydatech
Oct 15 2016 06:03
codepen.io
Amy Walters
@codecampamy
Oct 15 2016 06:05
Morning all I'm just at the beginning doing checkboxes :: The error I'm getting is "Each of your three checkbox elements should be nested in its own label element" Here's my code: <label><input type="checkbox" name="personality">
Loving</label>
<label><input type ="checkbox" name="personality">
Thoughtful</label>
<label><input type ="checkbox" name="personality" Antisocial</label>
I thought they're all in nested in their own labels??
Right! I got it! I missed a>
Zatania
@Zatania
Oct 15 2016 06:07
Anyone knows how to implement this on a site? https://github.com/satorumurmur/bibi
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:20
hey everyone ! i am not able to solve these three tasks and here they are Create a new p element around your a element.
Your a element should be nested within your new p element.
Your p element should have the text "View more " (with a space after it)

and the code is <h2 class="red-text">CatPhotoApp</h2>

<p> "view more" <a href="http://www.freecatphotoapp.com">cat photos</a></p>

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Zatania
@Zatania
Oct 15 2016 06:23
<p>View more <a href="link">Cat Photos</a>.</p>
@Dishantyadav
Adam Bishop
@bishmier
Oct 15 2016 06:28
can someone help, i have set the style to
div {
.silver-background {
background-color: silver;
}
now i can't seem to set the class within my div element to work
<div class="silver-background">
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>
Joseph
@Jar36
Oct 15 2016 06:29
@Dash0665 The assignment is saying that your link shouldn't have a URL attached yet. So i think it wants you to write <p>Click here for <a href ="#">cat photos</a>.</p> If you want the Click here to be the link then try this <p><a href= "#">Click here</a>for cat photos.</p>
Nesredin Mustefa
@nesru
Oct 15 2016 06:33

@bishmier You don't need the "div {" part on your style
use this
.silver-background {
background-color: silver;
}

instead of

div {
.silver-background {
background-color: silver;
}

Adam Bishop
@bishmier
Oct 15 2016 06:34
You're a star thank you, i've been looking at it a good half hour lol
Nesredin Mustefa
@nesru
Oct 15 2016 06:35
@bishmier You're welcome
Joseph
@Jar36
Oct 15 2016 06:37

@bishmier In your CSS you need to either use div or .silverbackground but not both. Example:

div {
background-color: silver;
}

or you could do this

.silver-background {
background-color:silver;
}

Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:37
@Zatania thanx
CamperBot
@camperbot
Oct 15 2016 06:37
dishantyadav sends brownie points to @zatania :sparkles: :thumbsup: :sparkles:
:cookie: 130 | @zatania |http://www.freecodecamp.com/zatania
Adolf
@Gersie
Oct 15 2016 06:39
How do i create a class smaller-image that needs to be 100 pixels
Joseph
@Jar36
Oct 15 2016 06:43
@Gersie Can you post what you have so far HTML and CSS?
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:47
how to turn a link into dead link as i am doing <a href="#">--</a>
but its showing nothing
Adolf
@Gersie
Oct 15 2016 06:48
blob
Nesredin Mustefa
@nesru
Oct 15 2016 06:49
@Dishantyadav
It should not show anything, that is why it is "dead"
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:50
@nesru i want to show that this task is given to me and i did as same as given in instruction but yet its showing red cross on the task
Joseph
@Jar36
Oct 15 2016 06:51
@Dishantyadav <a href ="#">Click here</a>
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:51
@Gersie before image source you have to derive a class
like this <img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Coy Sanders
@coymeetsworld
Oct 15 2016 06:52
order doesn't matter in html tags
could do source first if you wanted, or alt, or anything
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:53
@Gersie and then in style you can set its width whatever you want
@Jar36 i already did this bro
Joseph
@Jar36
Oct 15 2016 06:54
@Gersie Looks like you already have a class .smaller-image. Have you tried changing the style to 100px?
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:56
@Jar36 he didn't define the class
Joseph
@Jar36
Oct 15 2016 06:56
@Dishantyadav Sorry man, my bad I see that now.
@Dishantyadav Yup it needs to be defined in the HTML
Dishant singh yadav
@Dishantyadav
Oct 15 2016 06:59
@Jar36 no big issue man
Dishant singh yadav
@Dishantyadav
Oct 15 2016 07:05
@Jar36 i did this one with mine but yet its red cross on task. <p>Click here for <a href="#">cat photos</a>.</p>
Adolf
@Gersie
Oct 15 2016 07:06
Ive changed it to 100px not working
Joseph
@Jar36
Oct 15 2016 07:06
@Gersie In your image tag you need to add the class
Dishant singh yadav
@Dishantyadav
Oct 15 2016 07:06
@Gersie bro first deifine its class
Adolf
@Gersie
Oct 15 2016 07:07
Thanks its working
Joseph
@Jar36
Oct 15 2016 07:11
This message was deleted
@Dishantyadav That's strange.
This message was deleted
Coy Sanders
@coymeetsworld
Oct 15 2016 07:14
did you refresh between them @Jar36 ?
sometimes you can have right solution but test locks up, esp if you've been submitting multiple tests that have been failing it seems like
Joseph
@Jar36
Oct 15 2016 07:15
@coymeetsworld deleted them, i was trying to help some fellow coders out.
'''
CamperBot
@camperbot
Oct 15 2016 07:18
:bulb: to format code use backticks! ``` more info
Joseph
@Jar36
Oct 15 2016 07:19
This message was deleted
CamperBot
@camperbot
Oct 15 2016 07:19
:bulb: to format code use backticks! ``` more info
Joseph
@Jar36
Oct 15 2016 07:20
This message was deleted
Coy Sanders
@coymeetsworld
Oct 15 2016 07:20
oh well you shouldn't just give the answers out if you're trying to help @Jar36
people will just copy it and no way of knowing if they understand why, much harder to do anything later if you don't understand these fundamentals first
Joseph
@Jar36
Oct 15 2016 07:21
@coymeetsworld Noted. I will try in a different way.
Coy Sanders
@coymeetsworld
Oct 15 2016 07:22
i mean if its small its ok
but like in general, tough for people to learn if they just routinely copy answers from someone else
@lhmxi
Oct 15 2016 07:23
你的a元素应该是一个href属性设置为#的死链接 大神们这个怎么写?
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:23
hi All...
I am struck with a problem in creating background http://bit.ly/2dqQUKJ
can someone help me..
Coy Sanders
@coymeetsworld
Oct 15 2016 07:25
you got the divs right @rawvishwaaaa
you just need to apply the class it tells you to it
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:25
so the code should be as follows...
div {
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:26

hi all can u help me do this

Set the value of your placeholder attribute to "cat photo URL".

Coy Sanders
@coymeetsworld
Oct 15 2016 07:26
no you're not creating a div selector @rawvishwaaaa
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:26
.background-color:silver;}
Coy Sanders
@coymeetsworld
Oct 15 2016 07:26
you're creating a class
called silver-background, take a look at the example
and apply what you already know about classes
Joseph
@Jar36
Oct 15 2016 07:28
@rawvishwaaaa Remember that to style a class in CSS you need to have it declared in your HTML
It looks like you have done this at least once in your image tag. You defined a class there..So try using that as an example.
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:28
Set the value of your placeholder attribute to "cat photo URL".
hey help me pls
any1 der?
Joseph
@Jar36
Oct 15 2016 07:30
@ABhayj123 If you post what you have so far might help people help you better.
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:31
the link?
or whole code
Joseph
@Jar36
Oct 15 2016 07:31
@ABhayj123 either would work If it's code you can copy paste between back tics
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:32
<input type="text" placeholder="write our text here"
Set the placeholder value of your text input to "cat photo URL".
The finished input element should have valid syntax
https://www.freecodecamp.com/challenges/add-placeholder-text-to-a-text-field#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%3Cul%3E%0A%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%3Col%3E%0A%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%3C%2Fol%3E%0A%3Cinput%20type%3D%22text%22%20placeholder%3D%22write%20our%20text%20here%22%0A
Sonny Box
@Surlodor
Oct 15 2016 07:33
instead of "write our text here" put cat photo URL @ABhayj123
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:34
oh ty @Surlodor
CamperBot
@camperbot
Oct 15 2016 07:34
abhayj123 sends brownie points to @surlodor :sparkles: :thumbsup: :sparkles:
:cookie: 37 | @surlodor |http://www.freecodecamp.com/surlodor
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:35
still didnt work
Joseph
@Jar36
Oct 15 2016 07:36
@ABhayj123 Follow the instructions literally
Set the placeholder value of your text input to "cat photo URL".
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 07:36
oh
my bad sry @Jar36
Joseph
@Jar36
Oct 15 2016 07:38
@ABhayj123 Did it work?
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:38
@Jar36 i tried to create a CSS style ..but I am not able to rectify it http://bit.ly/2efYMfL could you please help
john
@johnBoss
Oct 15 2016 07:38
how to Your span element should have the text love.
stelecoms00
@stelecoms00
Oct 15 2016 07:38
how to learn mean stack?
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:43
@Jar36 yes
Joseph
@Jar36
Oct 15 2016 07:44
@rawvishwaaaa I see a few problems
Starters you have created a div element that is not needed line 28
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:45
@Jar36 ok...
Joseph
@Jar36
Oct 15 2016 07:45
@rawvishwaaaa Try to delete line 28 then we can work on getting the challenge done
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:46
I deleted line 28 @Jar36
brandonharlan23
@brandonharlan23
Oct 15 2016 07:46
guys I need help with sizing images
it says I ned to create a class called smaller-image in img but I have no idea how to do that
I've tried everything
Joseph
@Jar36
Oct 15 2016 07:47
@rawvishwaaaa Check line 35 that is where your div is that you need to work with
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:47
@Jar36 ok...I initially tried there..
let me code it again @Jar36
velile
@vestoe
Oct 15 2016 07:48
how do i uncomment
LydaTech
@lydatech
Oct 15 2016 07:48
@vestoe remove <!-- and -->
Joseph
@Jar36
Oct 15 2016 07:48
@rawvishwaaaa OK you were correct thats the div. If you remember you need to add a class to the div you want to style in CSS and the instructions tell you to add the class silver-background
LydaTech
@lydatech
Oct 15 2016 07:49
@brandonharlan23 Ive answered you in main chat
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:49
@Jar36 yes...that is why I created a Class
Ivaylo Tabakov
@ivaylotabakov
Oct 15 2016 07:49
Why am i doing html challenges? I wanna learn c++ or maybe even javascript?
brandonharlan23
@brandonharlan23
Oct 15 2016 07:50
I've added that! however when I hit run test it doesnt work
Joseph
@Jar36
Oct 15 2016 07:50
@rawvishwaaaa So the div on line 35 should have your class="silver-background"
brandonharlan23
@brandonharlan23
Oct 15 2016 07:50
I've done exactly that 50x if not more @lydatech
LydaTech
@lydatech
Oct 15 2016 07:50
@brandonharlan23 paste your url of the challenge
velile
@vestoe
Oct 15 2016 07:50
thax @lydatech
LydaTech
@lydatech
Oct 15 2016 07:51
@brandonharlan23 you havent applied the class to your image
Sahil Kumar
@rinpasahil333
Oct 15 2016 07:51
@brandonharlan23 <img class="smaller-img"src="http://yourphotourl"/>
I guess this will work
LydaTech
@lydatech
Oct 15 2016 07:51
@rinpasahil333 no
brandonharlan23
@brandonharlan23
Oct 15 2016 07:51
how do I add it then
Sahil Kumar
@rinpasahil333
Oct 15 2016 07:51
Try it
Ivaylo Tabakov
@ivaylotabakov
Oct 15 2016 07:51
@lydatech why am i doing html5 challenges when i dont want to do them?
brandonharlan23
@brandonharlan23
Oct 15 2016 07:52
I know how to change the size but not apply smaller-image to the img
LydaTech
@lydatech
Oct 15 2016 07:52
@rinpasahil333 you have a typo
Sahil Kumar
@rinpasahil333
Oct 15 2016 07:52
@ivaylotabakov you can go to javascript challenges by clicking on map
LydaTech
@lydatech
Oct 15 2016 07:52
right after <img add class="smaller-image"
Sahil Kumar
@rinpasahil333
Oct 15 2016 07:52
Directly
@lydatech what i had written
You are tellling same thing
Ivaylo Tabakov
@ivaylotabakov
Oct 15 2016 07:53
@rinpasahil333 do they have c++ challenges and lessons or whatever?
brandonharlan23
@brandonharlan23
Oct 15 2016 07:53
That worked
thank you
LydaTech
@lydatech
Oct 15 2016 07:53
@rinpasahil333 you wrote <img class="smaller-img"src="http://yourphotourl"/> which is a type the incorrect class name
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:54
@Jar36 nope..I couldnt get thru :(
LydaTech
@lydatech
Oct 15 2016 07:54
@rinpasahil333 and your quotes are wrong at the end
@rinpasahil333 so your answer was wrong
@ivaylotabakov then dont if you dont want to
Joseph
@Jar36
Oct 15 2016 07:56
@rawvishwaaaa come to private chat
rawvishwaaa
@rawvishwaaaa
Oct 15 2016 07:56
@Jar36 ok
LydaTech
@lydatech
Oct 15 2016 08:00
@rawvishwaaaa

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
  .silver-background{background-color: silver;}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back" src="https://bit.ly/fcc-relaxing-cat"></a>

<div class="silver-background">
  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
</div>

<form action="/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
  <label><input type="checkbox" name="personality" checked> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>
brandonharlan23
@brandonharlan23
Oct 15 2016 08:02
@lydatech how can I incorporate the bprder-radius?
border*
I got it lol
Dishant singh yadav
@Dishantyadav
Oct 15 2016 08:09
@Jar36 what
Marcellana
@Marcellana
Oct 15 2016 08:14
Hey i need someone's Help...
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 08:16

<input type="text" placeholder="cat photo URL">

<form action="/submit-cat-photo"></form>
Nest your text input element within a form element.
how do i do it?

help pls
CamperBot
@camperbot
Oct 15 2016 08:16
no wiki entry for: pls
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 08:17
help please
CamperBot
@camperbot
Oct 15 2016 08:17
no wiki entry for: please
CamperBot
@camperbot
Oct 15 2016 08:17
no wiki entry for: me please httpswwwfreecodecampcomchallengesuncomment-htmlsolution0a3c--0a--3e3ch13ehello20world3c2fh13e0a0a--3e3ch23ecatphotoapp3c2fh23e0a0a--3e3cp3ehello20paragraph3c2fp3e0a--3e0a
mounirelfarra
@mounirelfarra
Oct 15 2016 08:17
div element
Marcellana
@Marcellana
Oct 15 2016 08:17
What?
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 08:18

<input type="text" placeholder="cat photo URL">

<form action="/submit-cat-photo"></form>
Nest your text input element within a form element.
how do i do it?

Marcellana
@Marcellana
Oct 15 2016 08:18
from my stage
Harshit Garg
@theharshitgarg
Oct 15 2016 08:18
<form action="/submit-cat-photo"><input type="text"></form> @ABhayj123
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 08:21
It worked @theharshitgarg but can u explain what is <form> used for?
Harshit Garg
@theharshitgarg
Oct 15 2016 08:21
@ABhayj123 that is used to create a form in the webpage.
Abhay Jaybhaye
@ABhayj123
Oct 15 2016 08:23
ty @theharshitgarg
CamperBot
@camperbot
Oct 15 2016 08:23
abhayj123 sends brownie points to @theharshitgarg :sparkles: :thumbsup: :sparkles:
:cookie: 584 | @theharshitgarg |http://www.freecodecamp.com/theharshitgarg
Harshit Garg
@theharshitgarg
Oct 15 2016 08:23
It ensures that all your content in the form element is treated as a unit and is passed to a function to web server which is supposed to process those fields in the form.
@ABhayj123 u are welcome
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:33
@lydatech oops sorry man
Akhil
@akhilnandu
Oct 15 2016 08:34
Guys
Need helo
Help
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:35
yup man say
Akhil
@akhilnandu
Oct 15 2016 08:35
Stucked at callange 53
:worried:
challange*
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:36
link to challenge
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:37
you want complete solution ????
or nything specific
Akhil
@akhilnandu
Oct 15 2016 08:38
Complete solution would be more helpful :smile:
Sophanarith Sok
@sok213
Oct 15 2016 08:39
@akhilnandu You need to add the css code in the style tags, not the h1 tag
 body {
    background-color: black;
    color :green; 
    font-family: Monospace; 
  }
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:40
  body {
    background-color: black;
    color:green;
    font-family:monospace;
  }



</style>
<h1 style="color :green; font-family: Monospace"> Hello World</h1>
Akhil
@akhilnandu
Oct 15 2016 08:40
@sok213 @rinpasahil333 Thanks Guys :+1:
CamperBot
@camperbot
Oct 15 2016 08:40
akhilnandu sends brownie points to @sok213 and @rinpasahil333 :sparkles: :thumbsup: :sparkles:
:cookie: 100 | @rinpasahil333 |http://www.freecodecamp.com/rinpasahil333
:cookie: 675 | @sok213 |http://www.freecodecamp.com/sok213
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:41
@rinpasahil333 css is written within style tags, not inside html
that's the only proper way to code
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:42
@diomed forgot to put <style>
noted
<style>
  body {
    background-color: black;
    color:green;
    font-family:monospace;
  }
</style>
<h1 style="color :green; font-family: Monospace"> Hello World</h1>
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:43
@rinpasahil333 u shouldn't have this at all style="color :green; font-family: Monospace" where it is
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:43
okay @diomed
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:43
are u trying to solve some task on FCC or code on your own?
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:44
yes
michael
@gfear
Oct 15 2016 08:44
its a tak in fcc i just done it a couple hours ago
task*
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:45
@gfear yup
michael
@gfear
Oct 15 2016 08:46
are you still having issues with it
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:46
@gfear nah
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:47
O.o
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:49
guys need help
stuck at challenge 43
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:49
what's the name of challenge?
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:49
link plz
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:49
and what is your code?
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:49
https://www.freecodecamp.com/challenges/give-a-background-color-to-a-div-element#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cdiv%3E%0A%20%20%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%20%20%3Cul%3E%0A%20%20%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%20%20%3C%2Ful%3E%0A%20%20%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%20%20%3Col%3E%0A%20%20%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%20%20%3C%2Fol%3E%0A%3C%2Fdiv%3E%0A%0A%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%20checked%3E%20Indoor%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Outdoor%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%20checked%3E%20Loving%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Lazy%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Energetic%3C%2Flabel%3E%0A%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%20required%3E%0A%20%20%3Cbutton%20type%3D%22submit%22%3ESubmit%3C%2Fbutton%3E%0A%3C%2Fform%3E%0A

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"></a>

<div>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:51
why didn't u try anything?
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:51
i have try everything i know
but still could not find the solution
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:51
but your solution doesn't display that.
it's empty
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:52
because after i try something new i usually reset
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:53
well try something by following guidelines, and copy-paste it here.
Adam Bishop
@bishmier
Oct 15 2016 08:54

can someone please help on the challenge Inherit Styles from the Body Element please? So far i have

<style>

body {
background-color: green;
font-family: monospace;
}

</style>

<h1> Hello world </h1>

Sahil Kumar
@rinpasahil333
Oct 15 2016 08:55
This message was deleted
This message was deleted
@bishmier
```
May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:56
@bishmier it shouldn't be background-color, just color
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:57

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"></a>

<div>
.silver-background {
background-color: silver;
}
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

May Kittens Devour Your Soul
@diomed
Oct 15 2016 08:58

@mrfirki but do you see that stuff like these

.silver-background {
background-color: silver;
}

go between style tags?

the ones above
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:58
@mrfirki and after that give your div class of silver-background
Adam Bishop
@bishmier
Oct 15 2016 08:58
thanks @diomed i'm a bit slow today
CamperBot
@camperbot
Oct 15 2016 08:58
bishmier sends brownie points to @diomed :sparkles: :thumbsup: :sparkles:
:star2: 1085 | @diomed |http://www.freecodecamp.com/diomed
Sahil Kumar
@rinpasahil333
Oct 15 2016 08:59
<div class="silver-background">
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 08:59
yes i have try insert into the style class
Sahil Kumar
@rinpasahil333
Oct 15 2016 09:00
<div class="silver-background">
  <p >Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
</div>
.silver-background{
background-color: silver;
}
inside style tag
Muhammad Fikri Bin Mohd Ariffin
@mrfirki
Oct 15 2016 09:01
@rinpasahil333 ok will try that
Sahil Kumar
@rinpasahil333
Oct 15 2016 09:05
@mrfirki okay
Jason Inthoulay
@jasonboss
Oct 15 2016 09:09
Hi everyone, I need some help on giving my form id element a green background. Here is what I tried.https://www.freecodecamp.com/challenges/use-an-id-attribute-to-style-an-element#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%0A%20%20.silver-background%20%7B%0A%20%20%20%20background-color%3A%20silver%3B%0A%20%20%7D%0A%20%20%23cat-photo-element%20%7Bbackground-color%3A%20green%3B%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cdiv%20class%3D%22silver-background%22%3E%0A%20%20%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%20%20%3Cul%3E%0A%20%20%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%20%20%3C%2Ful%3E%0A%20%20%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%20%20%3Col%3E%0A%20%20%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%20%20%3C%2Fol%3E%0A%3C%2Fdiv%3E%0A%0A%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%20id%3D%22cat-photo-form%22%20background-color%3D%22green%22%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%20checked%3E%20Indoor%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Outdoor%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%20checked%3E%20Loving%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Lazy%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Energetic%3C%2Flabel%3E%0A%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%20required%3E%0A%20%20%3Cbutton%20type%3D%22submit%22%3ESubmit%3C%2Fbutton%3E%0A%3C%2Fform%3E%0A
Nesredin Mustefa
@nesru
Oct 15 2016 09:10
Does anyone know fa code for FreeCodeCamp, if any?
Sahil Kumar
@rinpasahil333
Oct 15 2016 09:10
@jasonboss can you paste your code here
Chanel Mepschen
@ChanelZM
Oct 15 2016 09:11
@jasonboss you have to put the background-color attribuut between your <style>. Kind of like this: #cat-photo-form{background-color: green;}
@jasonboss the # means id in your <style>
Sahil Kumar
@rinpasahil333
Oct 15 2016 09:12
#cat-photo-form{
    background-color:green;
  }
Jason Inthoulay
@jasonboss
Oct 15 2016 09:14

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}

.smaller-image {
width: 100px;
}

.silver-background {
background-color: silver;
}
#cat-photo-element {background-color: green;}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"></a>

<div class="silver-background">
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
</div>

<form action="/submit-cat-photo" id="cat-photo-form" background-color="green">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>

Here is what I have
Sahil Kumar
@rinpasahil333
Oct 15 2016 09:15
<form action="/submit-cat-photo" id="cat-photo-form">
May Kittens Devour Your Soul
@diomed
Oct 15 2016 09:15
@jasonboss u have element in style tags , and it should be form
<