These are chat archives for FreeCodeCamp/Help

28th
May 2016
Henry
@iamhenrylam
May 28 2016 00:06
guys i have a question
so i'm new to coding and all, first time on codepen
i see that there is HTML CSS and JS
i'm making my tribute page, and was wondering, under my HTML editor, thats where the text i want to display goes
Anton Kaminsky
@nakamin
May 28 2016 00:07
@iamhenrylam yep that's right
Henry
@iamhenrylam
May 28 2016 00:07
while my CSS should contain my <style></style> right?
Manish Giri
@Manish-Giri
May 28 2016 00:07
@iamhenrylam more like the other way
Anton Kaminsky
@nakamin
May 28 2016 00:07
@iamhenrylam you don't need to put style tags
Henry
@iamhenrylam
May 28 2016 00:08
can you guys view my codepen?
Rob1nWood
@Rob1nWood
May 28 2016 00:08
add elements within your
Henry
@iamhenrylam
May 28 2016 00:08
am i doing things right?
Rob1nWood
@Rob1nWood
May 28 2016 00:08
help?!?
CamperBot
@camperbot
May 28 2016 00:08

CamperBot

Hi, I'm CamperBot! I can help you in this chatroom :smile:

Basic Commands:

  • find TOPIC find all entries about topic. e.g. find js
  • wiki TOPIC show contents of topic page
  • thanks @username send brownie points to another user
  • about @username shows info on that user
  • Algorithm BONFIRENAME info on a Algorithm

meet CamperBot in FreeCodeCamp/camperbotPlayground

:pencil: read more about camperbot on the FCC Wiki

Rob1nWood
@Rob1nWood
May 28 2016 00:09
find add elements within
CamperBot
@camperbot
May 28 2016 00:09

find add elements within

:zero: challenge add elements within your bootstrap wells

Manish Giri
@Manish-Giri
May 28 2016 00:09
@iamhenrylam there’s a basic flaw with your CSS
Anton Kaminsky
@nakamin
May 28 2016 00:09
@iamhenrylam use the css section of codepen for your css
Henry
@iamhenrylam
May 28 2016 00:09
wait, wasn't that what i did?
i was messing around with it and put <style> in html to see if it would still work, which it did
but can you readload my codepen and see if its correct now?
Mr Yawe
@Yates2099
May 28 2016 00:10
hello world
CamperBot
@camperbot
May 28 2016 00:10

welcome to FreeCodeCamp @Yates2099!

Anton Kaminsky
@nakamin
May 28 2016 00:11
@iamhenrylam yeah it's good now
Henry
@iamhenrylam
May 28 2016 00:11
awesome! thanks for the clarification @nakamin
CamperBot
@camperbot
May 28 2016 00:11
iamhenrylam sends brownie points to @nakamin :sparkles: :thumbsup: :sparkles:
:cookie: 261 | @nakamin |http://www.freecodecamp.com/nakamin
Anton Kaminsky
@nakamin
May 28 2016 00:11
@iamhenrylam np you might want to tidy your code though
there's a button there to do it
it should say "Tidy"
Henry
@iamhenrylam
May 28 2016 00:12
ah, yes. i just pressed it
still working on it :)
Mr Yawe
@Yates2099
May 28 2016 00:12
hey y'all please who develops with wordpress
i need some help
Anton Kaminsky
@nakamin
May 28 2016 00:12
@iamhenrylam we live we learn right ? :wink:
Henry
@iamhenrylam
May 28 2016 00:14
yes yes :)
Manish Giri
@Manish-Giri
May 28 2016 00:15

@iamhenrylam not sure if this is deliberate, but in your code

h1 {
  font-family: "Lucida Console";
  color: green;
  text-align: center;
  font-weight: bold;
}

h2 {
  color: purple;
  text-align: center;
}

body {
  font-family: "Courier New";
  color: #ff3300;
  background-color: lightblue;
}

the order is a bit messed up

Henry
@iamhenrylam
May 28 2016 00:16
the order?
Rob1nWood
@Rob1nWood
May 28 2016 00:16
find create a class to target
CamperBot
@camperbot
May 28 2016 00:16

find create a class to target

:zero: challenge create a class to target with jquery selectors

Manish Giri
@Manish-Giri
May 28 2016 00:17
@iamhenrylam CSS is Cascading Style Sheets, so the rules cascade downwards, the ones at the bottom have higher priority than the rules of the same type that are at the top
Henry
@iamhenrylam
May 28 2016 00:18
can you explain a little more?
i'm not really comprehending what you are trying to tell me
Manish Giri
@Manish-Giri
May 28 2016 00:19
@iamhenrylam one sec
Mr Yawe
@Yates2099
May 28 2016 00:19
adios amigos
Manish Giri
@Manish-Giri
May 28 2016 00:20
@iamhenrylam a general rule with css is to specify the most general rules at the top of your stylesheet, and the more specific ones at the bottom
Mr Yawe
@Yates2099
May 28 2016 00:20
you should hve at least cared to say hi
Anton Kaminsky
@nakamin
May 28 2016 00:20
@Yates2099 sorry man
@Yates2099 hi :smile:
Manish Giri
@Manish-Giri
May 28 2016 00:21
@iamhenrylam so, body is the most generic selector in your css, and yet it’s placed at the bottom. It should be placed at the top. h1 is more specific than body, so h1 comes next, then h2, and so on...
Henry
@iamhenrylam
May 28 2016 00:22
ah
so essentially, its a hierarchy?
Mr Yawe
@Yates2099
May 28 2016 00:23
@nakamin tnx fr caring
how do u do
?
Manish Giri
@Manish-Giri
May 28 2016 00:25

@iamhenrylam yeah, try it out yourself. Create two separate rules for the same element, like h1, and see what happens on the page, for instance -

h1 {
color: red;
}

h1 {
color: blue;
}

now check out what’s the final color

Henry
@iamhenrylam
May 28 2016 00:26
Ah, I get what you are saying. Thanks @Manish-Giri
CamperBot
@camperbot
May 28 2016 00:26
iamhenrylam sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 1132 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
May 28 2016 00:27
@iamhenrylam sure thing
Anton Kaminsky
@nakamin
May 28 2016 00:28
@Yates2099 I'm alright are you new?
Mr Yawe
@Yates2099
May 28 2016 00:28
@nakamin sure i am
just joined
Anton Kaminsky
@nakamin
May 28 2016 00:29
@Yates2099 ok, go to the main chat FreeCodeCamp/FreeCodeCamp and say hello world there!
Welcome to FCC btw!
Mr Yawe
@Yates2099
May 28 2016 00:30
tnx lots
Anton Kaminsky
@nakamin
May 28 2016 00:30
@Yates2099 np :smile:
rphares
@rphares
May 28 2016 00:30
Welcome~ Do drop into the general chat :blush:
And visit us here if you get stuck on any of the html, css, bootstrap, or jQuery challenges :)
Mr Yawe
@Yates2099
May 28 2016 00:31
@rphares tnx too
rphares
@rphares
May 28 2016 00:31
Of course!Happy coding :blush:
Andrew Jackson
@AJack93
May 28 2016 00:33
Hello all
rphares
@rphares
May 28 2016 00:33
Hiya~
Edwin
@Ecaceress
May 28 2016 00:39
Hello eveyone
Stephen Mansfield
@StephenMansfield
May 28 2016 00:39
whats up @Ecaceress
rphares
@rphares
May 28 2016 00:39
Hi! :blush:
Edwin
@Ecaceress
May 28 2016 00:39
I'm stuck with a code
rphares
@rphares
May 28 2016 00:39
Which lesson?
Edwin
@Ecaceress
May 28 2016 00:39
I have to nest a text field in a form
rphares
@rphares
May 28 2016 00:39
ah--
the format should looks something like this
Edwin
@Ecaceress
May 28 2016 00:40
<form action="/url-where-you-want-to-submit-form-data"></form>
rphares
@rphares
May 28 2016 00:40
<form><INPUT STUFF HERE></form>
Edwin
@Ecaceress
May 28 2016 00:40
Yes
Lex Angel
@LexTheProgram
May 28 2016 00:40
Hey! Professor @rphares :smile: see you'r back at work
Edwin
@Ecaceress
May 28 2016 00:40
But it sais that I nest the input element within a form element
rphares
@rphares
May 28 2016 00:41
to nest, you put something between the two tags, @Ecaceress
not actually in the tags, in between them
Hiya, @LexTheProgram ! wb~ ;blush:
<div>
<p>I'm a p element nested in the div!</p>
</div>
Edwin
@Ecaceress
May 28 2016 00:41
Yes
rphares
@rphares
May 28 2016 00:42
same thing for your input
Edwin
@Ecaceress
May 28 2016 00:42
I've got it
hahaha
rphares
@rphares
May 28 2016 00:42
sweet!
Mike Moore
@moorejmike
May 28 2016 00:42
I'm on exercise "Use jQuery to Modify the Entire Page" and my jQuery Playground is showing 2 #target5 in the #left-well.
Edwin
@Ecaceress
May 28 2016 00:42
I wasnt sure about Nest definition
I'm from Peru
Thank you @rphares
CamperBot
@camperbot
May 28 2016 00:42
ecaceress sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4861 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 00:42
Anytime! Congrats and happy coding~
Mike Moore
@moorejmike
May 28 2016 00:42
Has anyone else had that problem?
rosethederp
@rosethederp
May 28 2016 00:42
I dont understand how to do the CSS class to style an element
rphares
@rphares
May 28 2016 00:42
@moorejmike , could you paste your formatted code please?
@rosethederp , you too~
explain format
CamperBot
@camperbot
May 28 2016 00:43

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

rosethederp
@rosethederp
May 28 2016 00:44
I'm really new to this so i have no idea what a formatted code is
rphares
@rphares
May 28 2016 00:44
you type three backticks, `
the backtick is usually near the esc key on most keyboards,
its on the same key as the ~
then, press shift + enter at the same time
a second row of three ` should appear
paste your code from the exercise, all of it, in between the two rows of backticks
(no code on the same line as the backticks-- they need their own rows)
you may need to press command + enter or control + enter to send
that will show your code in a way that is easy for us to read and help~
Mike Moore
@moorejmike
May 28 2016 00:46
<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target1").prop("disabled", true);
    $("#target4").remove();
    $("#target2").appendTo("#right-well");
    $("#target5").clone().appendTo("#left-well");
    $("#target1").parent().css("background-color", "red");
    $("#right-well").children().css("color", "orange");
    $("#left-well").children().css("color", "green");
    $(".target:nth-child(2)").addClass("animated bounce");
    $(".target:even").addClass("animated shake");

  });
</script>

<!-- Only change code above this line. -->

<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>
hmm, we've got a few differences, @moorejmike -
Andrew
@collegetiger
May 28 2016 00:48
Hello World
CamperBot
@camperbot
May 28 2016 00:48

welcome to FreeCodeCamp @collegetiger!

rphares
@rphares
May 28 2016 00:48
this lesson, Use jQuery to Modify the Entire Page , right? @moorejmike
Barton Benitez
@darundal
May 28 2016 00:48
@moorejmike There is a bug submitted regarding that
rphares
@rphares
May 28 2016 00:48
Hi, @collegetiger ~ welcome~
Lex Angel
@LexTheProgram
May 28 2016 00:48
:3
Mike Moore
@moorejmike
May 28 2016 00:48
@rphares the second #target5 just went away
Barton Benitez
@darundal
May 28 2016 00:48
If you delete the code and retype it it will display correctly
Mike Moore
@moorejmike
May 28 2016 00:48
@darundal Thank you!
CamperBot
@camperbot
May 28 2016 00:48
moorejmike sends brownie points to @darundal :sparkles: :thumbsup: :sparkles:
:cookie: 130 | @darundal |http://www.freecodecamp.com/darundal
Barton Benitez
@darundal
May 28 2016 00:48
When you run tests it will reappear
Andrew
@collegetiger
May 28 2016 00:49
ty @rphares
CamperBot
@camperbot
May 28 2016 00:49
collegetiger sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4862 | @rphares |http://www.freecodecamp.com/rphares
Andrew Gelston
@agelston6
May 28 2016 00:49
I'm stuck on CSS Class to Syle an Element
rosethederp
@rosethederp
May 28 2016 00:49
<style>
  .red-text { 
    color: red;
  }
</style>

<h2>CatPhotoApp</h2>

<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>
Mike Moore
@moorejmike
May 28 2016 00:49
@rphares Thank you!
CamperBot
@camperbot
May 28 2016 00:49
moorejmike sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4863 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 00:49
perfect, @rosethederp !
Sean DiSanti
@badc0ded
May 28 2016 00:49
hi all, how goes it?
rphares
@rphares
May 28 2016 00:49
and, @agelston6 , you are on the same one, so lets go over it in a group, shall we~
@rosethederp , you did the first step perfectly-
to use a class, you make it in the <style> section
you did that
Andrew Gelston
@agelston6
May 28 2016 00:49
thank you
rphares
@rphares
May 28 2016 00:50
next, you also need to apply it to the element you want,
otherwise, it doesn't know which element you want to use it on
so, in your html, which element are you supposed to give that class, @rosethederp , @agelston6 ?
Andrew Gelston
@agelston6
May 28 2016 00:50
We want to make the header red
rphares
@rphares
May 28 2016 00:50
(lol, i didn't do anything, @moorejmike , but glad you got it, congrats and happy coding! :blush: )
okay,
rosethederp
@rosethederp
May 28 2016 00:51
the h2 one
rphares
@rphares
May 28 2016 00:51
so the way to apply a class looks like this-- i will give element the class "fake-class" as an example:
<element class = "fake-class">
you add class = "theClassName" to the elements tag
so, where i put element, you'd have h2, and where i put "fake-class" you'd have the class you want to use
Andrew Gelston
@agelston6
May 28 2016 00:52
Not sure what you mean by that. would the syntax be <style>
element-class="red-text".red-text {
color: red;
}
rphares
@rphares
May 28 2016 00:53
<style>

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

<h2 class = "fake-class">Some text</h2>
close, but this part, element-class="red-text" doesn't go in the <style> section,
it goes in your h2 tag,
Sean DiSanti
@badc0ded
May 28 2016 00:53
@rphares totally off subject but do you always put spaces like that around attribute assignment?
rphares
@rphares
May 28 2016 00:53
h2 is your element
lol, nah, sometimes-- readability wise, i prefer spaces (as I've never been exposed to other languages, so I'm not too concerned about spacing yet) but I'm not consistent, heh... @badc0ded
Andrew Gelston
@agelston6
May 28 2016 00:54
how, it worked!!
rphares
@rphares
May 28 2016 00:54
Yay!
And it'll be like that every time you use a class, @agelston6 --
and later on, you will use something called IDs, and its the same thing--
Sean DiSanti
@badc0ded
May 28 2016 00:55
yeah, i do that for styling in js and php etc, but for attributes i usually but them right up against the operator
rphares
@rphares
May 28 2016 00:55
you define it in the <style> section, and add it to the tag :blush: @agelston6
Sean DiSanti
@badc0ded
May 28 2016 00:55
and for some reason seeing it like that apparently makes my ocd twitch
rphares
@rphares
May 28 2016 00:55
@rosethederp , how you doing with it?
Andrew Gelston
@agelston6
May 28 2016 00:55
haha, thank you for the assist, I still have alot to learn!!
rosethederp
@rosethederp
May 28 2016 00:55
I'm still having trouble. I turned everything red instead of just my h2
rphares
@rphares
May 28 2016 00:55
lol, i shall try and keep it consistent or ya, @badc0ded ~
okay no worries-- can we see what you are trying now, @rosethederp ? :blush:
Sean DiSanti
@badc0ded
May 28 2016 00:56
@agelston6 if you tag @rphares in your ty, they'll get points that don't matter
CamperBot
@camperbot
May 28 2016 00:56
badc0ded sends brownie points to @agelston6 and @rphares :sparkles: :thumbsup: :sparkles:
:cookie: 16 | @agelston6 |http://www.freecodecamp.com/agelston6
:star2: 4864 | @rphares |http://www.freecodecamp.com/rphares
Sean DiSanti
@badc0ded
May 28 2016 00:56
like that
:)
rphares
@rphares
May 28 2016 00:56
Anytiem, @agelston6 -- congrats and happy coding~
rosethederp
@rosethederp
May 28 2016 00:56
<style> 
  .h2 { 
    color: red;
  }
</style>

<h2 class = CatPhotoApp</h2>

<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>
rphares
@rphares
May 28 2016 00:56
lol, well ty @badc0ded -- now I'm already fed, no need for more :blush:
CamperBot
@camperbot
May 28 2016 00:56
rphares sends brownie points to @badc0ded :sparkles: :thumbsup: :sparkles:
:cookie: 371 | @badc0ded |http://www.freecodecamp.com/badc0ded
rphares
@rphares
May 28 2016 00:56
Ahh-- close!
this line still needs a little work-
<h2 class = CatPhotoApp</h2>
Lex Angel
@LexTheProgram
May 28 2016 00:57
Lol almost 400 cookies
rphares
@rphares
May 28 2016 00:57
you need to put the class name "red-text" after the = @rosethederp -
that is the part that tells it which class you want,
then, be sure to close the tag with a >
example:
<p class= "red-text">Some text</p>
Sean DiSanti
@badc0ded
May 28 2016 00:58
lol, i saw that
rphares
@rphares
May 28 2016 00:58
( @badc0ded , that close enough, or do i need to delete my space after the = ?)
lol, shhh, i trying, I'm trying, can only remember so many rules at once! :wink2:
Sean DiSanti
@badc0ded
May 28 2016 00:59
you're fine, i promise i wasn't even asking you to change it, i just had not seen it like that before
jamil
@jamilll
May 28 2016 00:59
hi i just found a challange that askes me that Browser and Text zoom should be at 100%. they are already 100%
Sean DiSanti
@badc0ded
May 28 2016 00:59
i know html doesn't care about white space, but i just don't see it
rphares
@rphares
May 28 2016 00:59
When i used to hang out in main chat, there was a camper i adored-- who hated when people asked to use cbot,
had to make links for everything
@jamilll , on the lesson change the font size of an element?
could you please paste your formatted code?
explain format
CamperBot
@camperbot
May 28 2016 00:59

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

jamil
@jamilll
May 28 2016 01:00

<style>
.red-text {
color: red;
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>

rphares
@rphares
May 28 2016 01:00
ah, okeydoke--
jamil
@jamilll
May 28 2016 01:00
Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
rphares
@rphares
May 28 2016 01:00
it wasn't you to change the size by using css on your p elements
you have added the size to the class
but, it wants you to do it by p--
by class, now your h2 and ONE p element are size 16...
it only wants the p elements, and it wants both
so, you will need to delete font-size : 16px; from your class,
jamil
@jamilll
May 28 2016 01:01
ahh ok thx
Andrew Gelston
@agelston6
May 28 2016 01:01

@rphares
rphares
@rphares
May 28 2016 01:01
and add it to p :blush:
Halim G Naim H
@Ramapitecus
May 28 2016 01:01
Hey guys. I have found a little bug in the Recipe Box example project
rosethederp
@rosethederp
May 28 2016 01:01
cool i got it. Thank you!
rphares
@rphares
May 28 2016 01:01
Awesome! congrats and happy coding~
Halim G Naim H
@Ramapitecus
May 28 2016 01:01
Following the Help Link, I have come here
Sean DiSanti
@badc0ded
May 28 2016 01:02
what's going on @Ramapitecus
Halim G Naim H
@Ramapitecus
May 28 2016 01:02
I'ts just a very small issue really, @badc0ded
He splits the ingredients by comas, but doesn't delete empty elements
Andrew Gelston
@agelston6
May 28 2016 01:03
thanks @rphares
CamperBot
@camperbot
May 28 2016 01:03
agelston6 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4865 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 01:03
Anytime! :blush:
Sean DiSanti
@badc0ded
May 28 2016 01:03
looking it up right now, i'm not familiar with that one off the top of my head
Halim G Naim H
@Ramapitecus
May 28 2016 01:03
So I you have a typo and leave a trailing coma, or have something like ',,' it will show you an empt slot
Randy Goggin
@frogshelp
May 28 2016 01:04
can some one help me here im on challenge Responsively Style Radio Buttons iget all checked but the third one that is make sure all your div's have a closing tag but no matter where i close it at it wont close i had this issue a coulpe challenges ago and i figured it but this one refuses to close
Sean DiSanti
@badc0ded
May 28 2016 01:04
oh in the example?
Halim G Naim H
@Ramapitecus
May 28 2016 01:04
after spliting, filter out empty items
rphares
@rphares
May 28 2016 01:04
hiya, @frogshelp ,
Halim G Naim H
@Ramapitecus
May 28 2016 01:04
just adding a filter on line 96 of his code would solve it
Randy Goggin
@frogshelp
May 28 2016 01:04

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

<form action="/submit-cat-photo">
<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>

thats my code
hiya @rphares
rphares
@rphares
May 28 2016 01:06
so, it wants you to close each of the <div class="col-xs-6"> right after the </label>s, @frogshelp ,
Randy Goggin
@frogshelp
May 28 2016 01:06
idk
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.
rphares
@rphares
May 28 2016 01:06
okay, ill post your code back with some comments, one sec
Manish Giri
@Manish-Giri
May 28 2016 01:06
This message was deleted
Randy Goggin
@frogshelp
May 28 2016 01:06
thats what it says i get top two to go but cant get it to close div's
Sean DiSanti
@badc0ded
May 28 2016 01:07
I'll be back shortly real life calls again. time to taxi teenagers
rphares
@rphares
May 28 2016 01:07
<div class="row"> 
 <div class="col-xs-6">// here you OPENED a div
   <label><input type="radio" name="indoor-outdoor"> Indoor</label>// so you need to close it HERE
     <div class="col-xs-6"> // here you OPENED another div
    <label>  <input type="radio" name="indoor-outdoor"> Outdoor</label>//so you need to close it here
    </div>
@frogshelp
Michael Wolf Hoffman
@mwolfhoffman
May 28 2016 01:07
I am trying to nest a text field in a form element, but am not able to pass this activity
rphares
@rphares
May 28 2016 01:08
(you may need to scroll right to see the relevant comments, @frogshelp , sorry! :blush: )
Michael Wolf Hoffman
@mwolfhoffman
May 28 2016 01:08
Could someone help me?
Randy Goggin
@frogshelp
May 28 2016 01:08
but dont it close with the div at the bottom or i need to add two more
rphares
@rphares
May 28 2016 01:08
Sure, @runnerguy55 --
@frogshelp , two more, ill scrolls down to see what you did in just a sec, this is a quick one--
Michael Wolf Hoffman
@mwolfhoffman
May 28 2016 01:08

@rphares

<form action="/submit-cat-photo"> input type="text" placeholder="cat photo URL"
</form>

rphares
@rphares
May 28 2016 01:09

@runnerguy55 , the format should be something like:

<form><INPUT STUFF HERE></form>

Myrons system
@Myron000
May 28 2016 01:09
I'm having a bit of trouble getting the green border around my cat image. My image class is <img class="smaller-image thick green border"> src="https://bit.ly/fcc-relaxing-cat" Anyone have any ideas? thx.
rphares
@rphares
May 28 2016 01:09
your input stuff needs < and >
Michael Wolf Hoffman
@mwolfhoffman
May 28 2016 01:09
lol thanks @rphares
CamperBot
@camperbot
May 28 2016 01:09
runnerguy55 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4866 | @rphares |http://www.freecodecamp.com/rphares
Andy
@AMBONOLA
May 28 2016 01:09
@rphares Hi how are you today?
rphares
@rphares
May 28 2016 01:10
@frogshelp , the first </div> you had in your first post is closing the <div class "row"> , not the new ones you added
so that DOESNT close the <div class="col-xs-6">
Randy Goggin
@frogshelp
May 28 2016 01:10
ok it worked where u said to close it at thank you very much wass stuck on it for a night an all day lol thanks again your very heelpful @rphares
CamperBot
@camperbot
May 28 2016 01:10
frogshelp sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4867 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 01:10
and the second one is closing.... not sure
oh, congrats! glad you got it and anytime~
Hiya, @AMBONOLA ! Wb :blush:
Randy Goggin
@frogshelp
May 28 2016 01:11
ya i left it closed at bottom then just added the two others where u said to and it closed them
rphares
@rphares
May 28 2016 01:11
Anytime, @runnerguy55 ~ Congrats and happy coding!
Randy Goggin
@frogshelp
May 28 2016 01:11
<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>
rphares
@rphares
May 28 2016 01:11
@Myron000 , sorry, missed you in all the change--
Randy Goggin
@frogshelp
May 28 2016 01:11
thats how i did it
clayscode
@clayscode
May 28 2016 01:11
Hi guys, I'm just getting started and I have a question about the challenge "Create a Bulleted Unordered List"
rphares
@rphares
May 28 2016 01:11
i think you are missing the - in the second class
Randy Goggin
@frogshelp
May 28 2016 01:11
see where i left boottom closed
AJ Robisch
@AJFelidae
May 28 2016 01:12
Hey, trying to override the body with a pink-text CSS element, but the lesson says my <style> does not have a "pink-text CSS class with it's color set to pink."
rphares
@rphares
May 28 2016 01:12
i think it was something like thick-green-border, @Myron000 ... you have spaces?
Andy
@AMBONOLA
May 28 2016 01:12

@rphares Wherer am I messing up here?

<style>
body {
background-color: black;
font-family: Monospace;
color: green;
}
.pink-text {
color: pink;
}
</style>

<h1 color:"pink-text">Hello World!</h1>

Khyrul Bashar
@kBashar
May 28 2016 01:12
@clayscode what is it?
AJ Robisch
@AJFelidae
May 28 2016 01:12
What andy linked
rphares
@rphares
May 28 2016 01:12
@AMBONOLA <h1 color:"pink-text">
should be using a =, not :
Andy
@AMBONOLA
May 28 2016 01:12
ooops!
clayscode
@clayscode
May 28 2016 01:12
I've done everything the challenge requires (at least I think) and it's still not submitting. Here's my code
Andy
@AMBONOLA
May 28 2016 01:12
@rphares Makes me feel silly! Thanks!
CamperBot
@camperbot
May 28 2016 01:12
ambonola sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4868 | @rphares |http://www.freecodecamp.com/rphares
Manish Giri
@Manish-Giri
May 28 2016 01:12
@AMBONOLA to add to it, should be using class= not color=
clayscode
@clayscode
May 28 2016 01:12
<u1>
<li>milk</li>
<li>cheese</li>
<li>yarn</li>
</u1>
Andy
@AMBONOLA
May 28 2016 01:13
@Manish-Giri Thank you
CamperBot
@camperbot
May 28 2016 01:13
ambonola sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 1133 | @manish-giri |http://www.freecodecamp.com/manish-giri
rphares
@rphares
May 28 2016 01:13
@AMBONOLA , happens all the time, dont worry, just rock the next one! :blush:
clayscode
@clayscode
May 28 2016 01:13
The challenge is the following:

HTML has a special element for creating unordered lists, or bullet point-style lists.

Unordered lists start with a <ul> element. Then they contain some number of <li> elements.

For example:

<ul>
<li>milk</li>
<li>cheese</li>
</ul>
would create a bullet point-style list of "milk" and "cheese".

Remove the last two p elements and create an unordered list of three things that cats love at the bottom of the page.

AJ Robisch
@AJFelidae
May 28 2016 01:13

<style>

body {
background-color: black;
font-family: Monospace;
color: green;
}
.pink-text
{
color: pink
}
</style>

<h1 class="pink-text">Hello World!</h1>

Manish Giri
@Manish-Giri
May 28 2016 01:13
@AMBONOLA anytime!
AJ Robisch
@AJFelidae
May 28 2016 01:13
It says the style element doesn't have a pink-text CSS class with its color set to pink
rphares
@rphares
May 28 2016 01:13
@clayscode , it wants three things, thats two...
markstevenshpvn
@markstevenshpvn
May 28 2016 01:13
Hi guys, how can I hightlight tabs in sequence, I have this code but it always go to other tabs immedialy. http://codepen.io/markstevens/pen/QEWEMJ
Coy Sanders
@coymeetsworld
May 28 2016 01:14
@Aviendhaast you're missing a semi-colon after color:pink
clayscode
@clayscode
May 28 2016 01:14
No, my code has three things
rphares
@rphares
May 28 2016 01:14
@Aviendhaast , missing a ; after color:pink
clayscode
@clayscode
May 28 2016 01:14
milk, cheese, and yarn
The example has two things
AJ Robisch
@AJFelidae
May 28 2016 01:14
@rphares Thanks so much, forget that all the time haha
CamperBot
@camperbot
May 28 2016 01:14
aviendhaast sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4869 | @rphares |http://www.freecodecamp.com/rphares
Myrons system
@Myron000
May 28 2016 01:14
image.png
Khyrul Bashar
@kBashar
May 28 2016 01:14
@clayscode <u1> should be <ul> l not 1
Myrons system
@Myron000
May 28 2016 01:15
image.png
rphares
@rphares
May 28 2016 01:15
@Myron000 , you've closed the tag too soon,
you have > before the source...
@clayscode , one sec, that one doesn't come up alot-- could you tell us the name of the lesson ?
clayscode
@clayscode
May 28 2016 01:16
Oh, thank you so much. I have a small laptop, and sometimes it's hard to tell the difference between characters
@kBashar Had the right answer
rphares
@rphares
May 28 2016 01:16
oh, sweet, didn't see it either, lol :|
and missed the reply in between the screenshots-- thanks, @kBashar , nice catch!
CamperBot
@camperbot
May 28 2016 01:17
rphares sends brownie points to @kbashar :sparkles: :thumbsup: :sparkles:
:cookie: 256 | @kbashar |http://www.freecodecamp.com/kbashar
Khyrul Bashar
@kBashar
May 28 2016 01:18
@clayscode np @rphares ha ha :)
Andy
@AMBONOLA
May 28 2016 01:19

Guys can anyone see what is wrong here?

<style>
.pink-text {
color: pink;
}
body {
background-color: black;
font-family: Monospace;
color: green;
}

</style>

<h1 color="pink-text">Hello World!</h1>

Myrons system
@Myron000
May 28 2016 01:20
@rphares Thank you. However I still don't see my green border, the width, or if its solid
CamperBot
@camperbot
May 28 2016 01:20
myron000 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4870 | @rphares |http://www.freecodecamp.com/rphares
Andy
@AMBONOLA
May 28 2016 01:20
it looks somewhwat right to me, but the lesson says my element doesn't have the class and that my element isn't pink
which it's right .-. but I am confused as to why it's not
Khyrul Bashar
@kBashar
May 28 2016 01:20
@AMBONOLA h1 class should be "pink-text" not color
<h1 class="pink-text">Hello World!</h1>
Andy
@AMBONOLA
May 28 2016 01:21
once again I am having an off night haha!
Manish Giri
@Manish-Giri
May 28 2016 01:21
@AMBONOLA I pointed this out last time -
<h1 class=“pink-text”></h1>
Andy
@AMBONOLA
May 28 2016 01:21
thanks @kBashar
CamperBot
@camperbot
May 28 2016 01:21
ambonola sends brownie points to @kbashar :sparkles: :thumbsup: :sparkles:
:cookie: 257 | @kbashar |http://www.freecodecamp.com/kbashar
Khyrul Bashar
@kBashar
May 28 2016 01:21
@AMBONOLA np
rphares
@rphares
May 28 2016 01:21
okay, can you paste code again-- or, while i rarely ask this, a url to your challenge so i can poke around and see whats going o? (i know it'll be long, but.. @Myron000 )
Andy
@AMBONOLA
May 28 2016 01:22
@Manish-Giri Sorry Manish I missunderstood I think
Manish Giri
@Manish-Giri
May 28 2016 01:22
@AMBONOLA Ah! My bad then! Should have been clearer..
Myrons system
@Myron000
May 28 2016 01:23
<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat">
Andy
@AMBONOLA
May 28 2016 01:23
@Manish-Giri I'm just being a dumby tonight, kinda half-distracted as well :P
Manish Giri
@Manish-Giri
May 28 2016 01:24
@AMBONOLA you’re coding on a Friday evening! That is motivation enough :smile: good luck!
Andy
@AMBONOLA
May 28 2016 01:25
haha thank you @Manish-Giri , I'm finding it very interesting and frankly I don't have a drinking buddy to go out with, so I might as well stay in and learn!
CamperBot
@camperbot
May 28 2016 01:25
ambonola sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: ambonola already gave manish-giri points
rphares
@rphares
May 28 2016 01:25
hmm, that part looks alright, @Myron000 - refresh and run tests again?
Manish Giri
@Manish-Giri
May 28 2016 01:28
@AMBONOLA I usually head to a Starbucks with my mac when I’m in that situation! Works out pretty well!
AJ Robisch
@AJFelidae
May 28 2016 01:28
<button class="btn btn-block">Like</button> - can anyone explain why it says it doesn't have the class btn-block?
It fills the width
Fixed itself, nevermind
Xavier Velez
@JonSnow08
May 28 2016 01:29
hey i'm doing the Records Collection checkpoint and im having a bit of an issue
Myrons system
@Myron000
May 28 2016 01:29
@rphares Thanks I found the problem in my CCS after solid I put a col0n instead of a semi colon
CamperBot
@camperbot
May 28 2016 01:29
myron000 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:warning: myron000 already gave rphares points
rphares
@rphares
May 28 2016 01:29
nice catch! Congrats and happy coding~
Xavier Velez
@JonSnow08
May 28 2016 01:30
how do i link my entire code box into here?
i feel like that's easier for people to read
Khyrul Bashar
@kBashar
May 28 2016 01:31
help formatting
CamperBot
@camperbot
May 28 2016 01:31

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Khyrul Bashar
@kBashar
May 28 2016 01:31
@JonSnow08 look example above
rphares
@rphares
May 28 2016 01:32
(and you may need to press command + enter or control + enter to send :blush: ) @JonSnow08
Xavier Velez
@JonSnow08
May 28 2016 01:32

// Setup
var collection = {
    2548: {
      album: "Slippery When Wet",
      artist: "Bon Jovi",
      tracks: [ 
        "Let It Rock", 
        "You Give Love a Bad Name" 
      ]
    },
    2468: {
      album: "1999",
      artist: "Prince",
      tracks: [ 
        "1999", 
        "Little Red Corvette" 
      ]
    },
    1245: {
      artist: "Robert Palmer",
      tracks: [ ]
    },
    5439: {
      album: "ABBA Gold"
    }
};
// Keep a copy of the collection for tests
var collectionCopy = JSON.parse(JSON.stringify(collection));

// Only change code below this line
function updateRecords(id, prop, value) {
  if(value !== "" && prop !== "tracks"){
    value = prop;}
    else if(prop === "tracks" && value !== "") {
      id.tracks.push value;  
    }else if (value === ""){
      delete.prop;
    }
}    


  return collection;
}

// Alter values below to test your code
updateRecords(5439, "artist", "ABBA");
@rphares @kBashar thank you guys
CamperBot
@camperbot
May 28 2016 01:33
jonsnow08 sends brownie points to @rphares and @kbashar :sparkles: :thumbsup: :sparkles:
:cookie: 258 | @kbashar |http://www.freecodecamp.com/kbashar
:star2: 4871 | @rphares |http://www.freecodecamp.com/rphares
Xavier Velez
@JonSnow08
May 28 2016 01:34
again it's Records Collection Challenge
rphares
@rphares
May 28 2016 01:34
Awesome!
and, while i dont like helping on record collection (you should check out the JS room, https://gitter.im/FreeCodeCamp/HelpJavaScript)
on thing i can point out--
you dont wanna use dot notation in this one,
everything should be bracket-
here's a link to what helped me understand why,
Xavier Velez
@JonSnow08
May 28 2016 01:34
ah okay
rphares
@rphares
May 28 2016 01:34
though i feel lousy trying to explain it, so...
Xavier Velez
@JonSnow08
May 28 2016 01:35
no i've got an idea of how to. im just more comfortable with bracket notation, ill check that out though
sorry with dot notation i mean
rphares
@rphares
May 28 2016 01:37
yeah... turns out there are times when dot isn't okay, though. link helped me with that, heh, but here you on the comfort factor :blush:
other hints i can give-- but not good help, sorry--
{ value = prop;} isn't right... JS help room will probs be better for drilling down on how to fix it,
actually, all the {} need a lil something... Sorry i cant help more! :pensive:
MinSik
@mscho527
May 28 2016 01:39
Hi, I want to make a background-image for a section of my 'portfolio page'. However, it's not working so far. My css code is:
.intro-text{
padding: 50px 10px 10px 50px;
background-image: url('image-url') repeat-x;
background-position: cover;
background-size: cover;
}
Any helps would be very appreciated :)
flysky91
@flysky91
May 28 2016 01:43
@mscho527 can you show us the hmtl
html*
Xavier Velez
@JonSnow08
May 28 2016 01:48
@rphares i found some help on reddit, I may need to revisit that challenge to better understand it though
rphares
@rphares
May 28 2016 01:49
Awesome, congrats!
Xavier Velez
@JonSnow08
May 28 2016 01:49
i get why the answer is the answer, but I don't understand how I would have written it from scratch to be honest
apbowe
@apbowe
May 28 2016 01:49
css height issues? Why won't my div display at 100% of the page?
rphares
@rphares
May 28 2016 01:49
hmm, another camper, who will deserve a brownie for this, often sends people his pseudo for this one,
Xavier Velez
@JonSnow08
May 28 2016 01:49
not always the best practice, but I find following the answer back through the question helps me understand it better
rphares
@rphares
May 28 2016 01:49
// Write a function which takes:
//  an id, a property (prop), and a value.
function updateRecords(id, prop, value) {
// If value is non-blank (value !== "") 
// and prop is not "tracks" 
// then update or set the value for the prop.
    // Your code here

// If the prop is "tracks" and value is non-blank,
// push the value onto the end of the tracks array.
    // Your code here

// If value is blank, 
// delete that prop.
    // Your code here

// Always return the entire collection object.
  return collection;
}
@JonSnow08
flysky91
@flysky91
May 28 2016 01:50
@apbowe you cant display hight in 100% only width, you can only do high 100% if the div is set to position:absolute;
apbowe
@apbowe
May 28 2016 01:51
ok, thanks!
flysky91
@flysky91
May 28 2016 01:51
yw
Xavier Velez
@JonSnow08
May 28 2016 01:51
@rphares thats awesome thank whoever wrote that for me!
CamperBot
@camperbot
May 28 2016 01:51
jonsnow08 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:warning: jonsnow08 already gave rphares points
flysky91
@flysky91
May 28 2016 01:51
@apbowe try to use em instead
apbowe
@apbowe
May 28 2016 01:52
ok. I was using px earlier but it kept pushing the page down
rphares
@rphares
May 28 2016 01:53
@JonSnow08 sent him brownies in the JS room :blush:
apbowe
@apbowe
May 28 2016 01:54
How do yo send brownie points? My 4th day here
rphares
@rphares
May 28 2016 01:54
explain brownie
CamperBot
@camperbot
May 28 2016 01:54

:point_right: brownie points [wiki]

Brownie Points

The number beside your picture on Free Code Camp tells you how many Brownie Points you have.

A user profile picture next to a with Brownie Points score

There are two ways you can get Brownie Points:

  1. Complete challenges - you get one point per challenge you complete
  2. Help other campers in chat - each time you help another camper and they thank you (by typing "thanks @yourname"), you will get a point

Brownie Points help you look like the kind of person who codes a lot, shares relevant links, and helps people.

They also add to your Streak.

:pencil: read more about brownie points on the FCC Wiki

rphares
@rphares
May 28 2016 01:54
(you say thanks @username )
CamperBot
@camperbot
May 28 2016 01:54
rphares sends brownie points to @username :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for username
apbowe
@apbowe
May 28 2016 01:54
thanks @flysky91
CamperBot
@camperbot
May 28 2016 01:54
apbowe sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 128 | @flysky91 |http://www.freecodecamp.com/flysky91
flysky91
@flysky91
May 28 2016 01:55
@apbowe yw, and thank you too :D
CamperBot
@camperbot
May 28 2016 01:55
flysky91 sends brownie points to @apbowe :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @apbowe |http://www.freecodecamp.com/apbowe
apbowe
@apbowe
May 28 2016 01:55
thanks @rphares
CamperBot
@camperbot
May 28 2016 01:55
apbowe sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4872 | @rphares |http://www.freecodecamp.com/rphares
apbowe
@apbowe
May 28 2016 01:55
pretty cool stuff
flysky91
@flysky91
May 28 2016 01:58
yes it is its my 2nd day here so i am new here to. I have to say i didnt find anything more helpful than freecodecamp. Nothing is offering that much. And i searched A LOT
Tony Gomez
@Tonyboy0521
May 28 2016 01:59
helloe
apbowe
@apbowe
May 28 2016 02:00
I did codecademy, but that is not a robust program. I've been focusing mainly on Javascript. Beginning Javascript, Javascript Enlightenment and Eloquent Javascript. I just bought a 4th book too.
Tony Gomez
@Tonyboy0521
May 28 2016 02:00
<h1>"helloworld"<h/1>
how do you close it
Khyrul Bashar
@kBashar
May 28 2016 02:01
@Tonyboy0521 </h1>
Tony Gomez
@Tonyboy0521
May 28 2016 02:01
ok thanks i am new to this
Khyrul Bashar
@kBashar
May 28 2016 02:02
@Tonyboy0521 np
rphares
@rphares
May 28 2016 02:03
ty @kBashar ~
CamperBot
@camperbot
May 28 2016 02:03
rphares sends brownie points to @kbashar :sparkles: :thumbsup: :sparkles:
:warning: rphares already gave kbashar points
Roberto Sanchez
@Robert9410
May 28 2016 02:12
Hi guys. I am trying to solve a problem where I have to change my title color but I do not know what I did wrong.
rphares
@rphares
May 28 2016 02:12
can you tell us the name of the lesson, please? @Robert9410
Roberto Sanchez
@Robert9410
May 28 2016 02:13
it is this one <style>
h2 {color: blue;}
CatPhotoApp;
</style>
rphares
@rphares
May 28 2016 02:13
ooh,
okeydoke, so--
Roberto Sanchez
@Robert9410
May 28 2016 02:13
it does not compile it
rphares
@rphares
May 28 2016 02:13
in yout style section,
you only want the part about the css,
Prabuddha Tuladhar
@coder077
May 28 2016 02:13
hi guys, I am trying to find if a given string is a palindrome or not. this code gives false for "race car" but i dont know why.
function palindrome(str) {
str.replace(/[^a-z0-9]+/gi, "");
str.toLowerCase();
var strArr=str.split("");
for(var i=0;i<Math.floor(strArr.length/2);i++){
if(strArr[i]!==strArr[strArr.length-1-i]){
return false;
}
}
return true;
}
Roberto Sanchez
@Robert9410
May 28 2016 02:13
yes
rphares
@rphares
May 28 2016 02:13
h2 {color: blue;} @Robert9410
the other line is the text that was in the headline,
so, you will move that back down after the </style>
Roberto Sanchez
@Robert9410
May 28 2016 02:14
Oh..I see thanks man
rphares
@rphares
May 28 2016 02:14
and, it still needs it's <h2> and </h2> tags
no worries~
Dhaval Ranavasiya
@metaphorG
May 28 2016 02:18
stuck here--->ink-to-external-pages-with-anchor-elements
rphares
@rphares
May 28 2016 02:18
okeydoke-- could you please paste your formatted code, @metaphorG ? :blush:
explain format
CamperBot
@camperbot
May 28 2016 02:18

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

Dhaval Ranavasiya
@metaphorG
May 28 2016 02:19
my code is
<a href ="http://www.freecatphotoapp.com">cat photos</a>
rphares
@rphares
May 28 2016 02:19
was there a www in the instructions, @metaphorG ?
Dhaval Ranavasiya
@metaphorG
May 28 2016 02:20
Oh sorry got that...thank you very much..:) @rphares
rphares
@rphares
May 28 2016 02:21
anytime~
Tony Gomez
@Tonyboy0521
May 28 2016 02:22
<style>
h2 {color: blue;}
</style>
is there something wrong
Khyrul Bashar
@kBashar
May 28 2016 02:22
@coder077 String.replace() returns a new string rather than changing the previous string(which is impossible in javascript theoretically anyway). so you have to
str =str.replace(/[^a-z0-9]+/gi, "");
rphares
@rphares
May 28 2016 02:23
@Tonyboy0521 , depends on the lesson and the ret of the code
Tony Gomez
@Tonyboy0521
May 28 2016 02:23
@kBashar how do you take the screen shot
rphares
@rphares
May 28 2016 02:23
could you tell us the name of the challenge?
explain format
CamperBot
@camperbot
May 28 2016 02:23

:point_right: code formatting [wiki]

Multi line Code

```js ⇦ Type 3 backticks and then press [shift + enter ⏎] (type js or html or css)

<paste your code here>,
then press [shift + enter ⏎]

``` ⇦ Type 3 backticks, then press [enter ⏎]

Single line Code

This an inline `<paste code here>` code formatting with a single backtick() at _start_ and _end_ around thecode`.

See also: ☛ How to type Backticks | ☯ Compose Mode | ❄ Gitter Formatting Basics

:pencil: read more about code formatting on the FCC Wiki

rphares
@rphares
May 28 2016 02:23
@Tonyboy0521 :point_up: thats how he posted that code :blush:
Khyrul Bashar
@kBashar
May 28 2016 02:24
Tony Gomez
@Tonyboy0521
May 28 2016 02:24
ok thanks! @rphares
CamperBot
@camperbot
May 28 2016 02:24
tonyboy0521 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4873 | @rphares |http://www.freecodecamp.com/rphares
flysky91
@flysky91
May 28 2016 02:24
Okey guys I have a question for you, to see how much you know. How much it took the developers to make C# and how much it took to make javascript?
rphares
@rphares
May 28 2016 02:25
sure thing~ If you let us know which challenge you are on, we can try and help?
@flysky91 , cannot comment, I'm a newbie :blush: (just wanted you to know I'm not ignoring you, just have no input~)
flysky91
@flysky91
May 28 2016 02:25
i am a newbie too, just try to guess
:D
Tony Gomez
@Tonyboy0521
May 28 2016 02:25
Use CSS selector to style Elements
flysky91
@flysky91
May 28 2016 02:25
i started yesterday here :P
rphares
@rphares
May 28 2016 02:26
okeydoke- that top part looks okay-- what is the rest of your code, @Tonyboy0521 ?
flysky91
@flysky91
May 28 2016 02:26
Well it took about 50 developers to make C# in about 4 years. Javascript....... 1 developer in 12 days!
freeredpill
@freeredpill
May 28 2016 02:27
Target Elements by Class Using jQuery
<script>
$(document).ready(function() {
$("button").addClass("animated bounce");
$(".well").addClass("animated bounce");
});
</script>
rphares
@rphares
May 28 2016 02:27
lol, i meant new to coding. Been on FCC a few months, actually, but this is the sum total of my coding knowledge, @flysky91 :pensive: def dont know anything about C#
freeredpill
@freeredpill
May 28 2016 02:27
Instructions are to: "Use the jQuery addClass() function to give the classes animated and shake to all your elements with the class well. "
I think my code is accurate, but I'm not sure
rphares
@rphares
May 28 2016 02:27
@freeredpill , you have "animated bounce"
freeredpill
@freeredpill
May 28 2016 02:27
its not letting me progres
flysky91
@flysky91
May 28 2016 02:28
@freeredpill bounce is not shake ? xD :D
freeredpill
@freeredpill
May 28 2016 02:28
Thank you. Shake. Right. Sorry!
rphares
@rphares
May 28 2016 02:29
ty @flysky91 ~
CamperBot
@camperbot
May 28 2016 02:29
rphares sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 133 | @flysky91 |http://www.freecodecamp.com/flysky91
flysky91
@flysky91
May 28 2016 02:29
@freeredpill Don't worry i was stuck on small circle. took me 10 minutes to figure out that it should be "smaller" not "small" circle :D
Khyrul Bashar
@kBashar
May 28 2016 02:29
@flysky91 both of the languages have evolved a lot to come where today they are. Of course first draft may take different times to design depending on the situations. So there is no straight answer to the question.
flysky91
@flysky91
May 28 2016 02:29
@rphares ty
CamperBot
@camperbot
May 28 2016 02:29
flysky91 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4874 | @rphares |http://www.freecodecamp.com/rphares
sagal guled
@sagal416
May 28 2016 02:29
I am attempting to nest my text input element within a form element
<form action=/submit-cat-photo input type="text" placeholder="cat photo URL"></form>
but its coming up wrong
rphares
@rphares
May 28 2016 02:30
your input needs its < and > @sagal416
Tony Gomez
@Tonyboy0521
May 28 2016 02:30
i got it lol
sagal guled
@sagal416
May 28 2016 02:30
or missing
rphares
@rphares
May 28 2016 02:30
<form stuff><input stuff></form>
Sweet! Congrats and happy coding, @Tonyboy0521 ~
flysky91
@flysky91
May 28 2016 02:30
@rphares so we are now feeding each other with brownie points xD hahah
rphares
@rphares
May 28 2016 02:31
lol, nah-- i usually try and thank people when i see them unfed for helping,
cant catch them all, but try to make up for it when i see it
but thanks for the brownie-- never needed, I'm a bit 'fat' :wink2:
flysky91
@flysky91
May 28 2016 02:31
nah you want a cookie i can feel it -.-
rphares
@rphares
May 28 2016 02:31
lol, awww, well tax you for feeding me :blush:
(thats an FCC joke-
tax used to send brownies, the bot was a bit off in its cues... :blush: )
sagal guled
@sagal416
May 28 2016 02:32
your the best @rphares
RishaBond
@RishaBond
May 28 2016 02:32
Hello world
CamperBot
@camperbot
May 28 2016 02:32

welcome to FreeCodeCamp @RishaBond!

flysky91
@flysky91
May 28 2016 02:32
@rphares at what challange are you now
@RishaBond welcome :D
rphares
@rphares
May 28 2016 02:32
too kind, @sagal416 ! Glad that helped~
Welcome, @RishaBond !
flysky91
@flysky91
May 28 2016 02:33
@rphares muahaha rly i didnt know, i tought its a joke about linux, because penguin and tax xD
rphares
@rphares
May 28 2016 02:33
lol, not working much on the challenges... mostly on outside studies atm :blush:
oddly enough, I'm not a linux user,
i needed a new avatar and asked a friend to pick me something...
he came up with this-- think it was just a cute baby animal thing, not meant to have any meaning, heh
Dhaval Ranavasiya
@metaphorG
May 28 2016 02:34
stuck again unable to proceed with challenge 29<p>Click here for <a #="http://www.freecatphotoapp.com">cat photos</a></p>
rphares
@rphares
May 28 2016 02:34
are you trying to make the link dead?
flysky91
@flysky91
May 28 2016 02:35
@metaphorG <a HREF="link"
Jannette Sanderson
@1jsanderson
May 28 2016 02:35
I am trying to add a jquery bouncing button. It says to add $("button").addClass("animated bounce"); into $(document).ready(function();) - does this mean it goes into the () at the end? I am confused!
rphares
@rphares
May 28 2016 02:35
you want to replace the link with the #
Joshua Abu
@Absolutestunna
May 28 2016 02:35
I have a security related question. I'm trying to implement a authentication/authorization solution for an admin console and I want to hide elements from a list on the page until the users have been authenticated. but I feel like putting a hide on the html element and "unhiding" it after authentication is confirmed isn't the best idea. Can't a user see the hidden elements in the console although the hidden elements aren't rendered on the screen initially?
rphares
@rphares
May 28 2016 02:35
not replace the word href :blush:
flysky91
@flysky91
May 28 2016 02:36
@1jsanderson it goes int he brackets of function () { this one }
Dhaval Ranavasiya
@metaphorG
May 28 2016 02:36
oh ohk got that ty @rphares again.
CamperBot
@camperbot
May 28 2016 02:36
metaphorg sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4875 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 02:37
Anytime~
Jannette Sanderson
@1jsanderson
May 28 2016 02:37
oh, thanks @flysky91
CamperBot
@camperbot
May 28 2016 02:37
1jsanderson sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 134 | @flysky91 |http://www.freecodecamp.com/flysky91
Tony Gomez
@Tonyboy0521
May 28 2016 02:39
<style>
h2 {color: blue;}
</style>
it keeps saying your h2 element should be blue
hello
rphares
@rphares
May 28 2016 02:43
@Tonyboy0521 , can we see the rest of the code?
Tony Gomez
@Tonyboy0521
May 28 2016 02:45
<p> kitty ipsum dolor sit amet , shed everywhere shed everywhere stretching attack your ankles chase the red dot, heritable run catnip eat the grass sniff.</p>
rphares
@rphares
May 28 2016 02:45
@Tonyboy0521 , it seems you have deleted the <h2> from the html
so, when we use the css <style> section,
that where we put the details of the style changes we want,
but the stuff at the bottom, the html,
thats the content
so, even though we added some <style> rules,

<style>
h2 {color: blue;}
</style>
we still need the html
<h2>CatPhotoApp</h2>
Tony Gomez
@Tonyboy0521
May 28 2016 02:47
ahh ok ok
rphares
@rphares
May 28 2016 02:47
because, you told it to make all the <h2> blue,
but without that... you have no h2 to make blue :blush:
Tony Gomez
@Tonyboy0521
May 28 2016 02:49
ok thanks i got it!!
rphares
@rphares
May 28 2016 02:49
Awesome! Congrats and happy coding, @Tonyboy0521 ~
Tony Gomez
@Tonyboy0521
May 28 2016 02:49
Thanks the same to you !! @rphares
CamperBot
@camperbot
May 28 2016 02:49
tonyboy0521 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:warning: tonyboy0521 already gave rphares points
Andy
@AMBONOLA
May 28 2016 02:55

@rphares could you tell me what I did wrong here? <style>
body {
background-color: black;
font-family: Monospace;
color: green;
}

orange-text {

color: orange;

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

<h1 id="orange-text">
<h1 style="color: white" id="orange-text" class="pink-text blue-text">Hello World!</h1>

the text is white on the preview, but the challenge says my h1 isn't white?
rphares
@rphares
May 28 2016 02:56
this part, i'd guess:

`<h1 id="orange-text">

<h1 style="color: white" id="orange-text" class="pink-text blue-text">Hello World!</h1>`

all the h1 stuff should be in the same tag-
i think you can delete that first line-
<h1 id="orange-text">
as you have the id in the next one as well
Andy
@AMBONOLA
May 28 2016 02:56
@rphares you have amazing eyes
rphares
@rphares
May 28 2016 02:56
lol, hope that solves it--
Andy
@AMBONOLA
May 28 2016 02:56
I am like 3 for 3 tonight with missing the tiniest of things
but yes that works! thank you
rphares
@rphares
May 28 2016 02:57
if not, paste again and ask the room-- I'm about to head out for a short walk before dark :blush:
sweet! congrats and see y'all in a bit~
Andy
@AMBONOLA
May 28 2016 02:57
alright good night @rphares o/
Jose
@Jjmaster2010
May 28 2016 03:04
cant change my image to smaller-image pixels to 100\
how do i create a class called smaller-image for my img
??
charan008
@charan008
May 28 2016 03:08
hey guys my image is overflowing on the right side. how can i adjust it?
RishaBond
@RishaBond
May 28 2016 03:09
@charan008 position: centre ?
Khyrul Bashar
@kBashar
May 28 2016 03:09

in html

<img class = "smaller-image" src="">

in <style></style> tag add

.smaller-image{
width:100pc;
}
@Jjmaster2010 my above msg was for you. forgot to tag you
Jose
@Jjmaster2010
May 28 2016 03:11
@kBashar thanks bro i couldntdo the class to save my life ( haha pretty dumb i know but im getting the hang of it )
CamperBot
@camperbot
May 28 2016 03:11
jjmaster2010 sends brownie points to @kbashar :sparkles: :thumbsup: :sparkles:
:cookie: 259 | @kbashar |http://www.freecodecamp.com/kbashar
Jose
@Jjmaster2010
May 28 2016 03:11
fingers crosed
crossed*
Andy
@AMBONOLA
May 28 2016 03:11
@Jjmaster2010 you'd put it in your style tag like <style> .smaller-image { width: 100px; }
oh I am lagging
don't mind me
Khyrul Bashar
@kBashar
May 28 2016 03:12
@Jjmaster2010 hey, no prob. and best wishes.
Jose
@Jjmaster2010
May 28 2016 03:14

<img src="https://bit.ly/fcc-relaxing-cat">
<img class = "smaller-image" src="">

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

is that fine? its still not getting the 100 pixels wide for some reason
Khyrul Bashar
@kBashar
May 28 2016 03:16
<img class = "smaller-image" src="some image link">
you have to add the image link there I omitted it out. Look in your challenge there is a link there to put.
lcassettai
@lcassettai
May 28 2016 03:16
@Jjmaster2010 you declare two image tags
thatlocalasian
@thatlocalasian
May 28 2016 03:16
For the Hash symbol challenge, do you just replace the 'href' with a '#'?????
Khyrul Bashar
@kBashar
May 28 2016 03:17
<img class = "smaller-image" src="https://bit.ly/fcc-relaxing-cat">
@Jjmaster2010
Randy Goggin
@frogshelp
May 28 2016 03:17
@thatlocalasian <a href="#">
Alexander Køpke
@alexanderkopke
May 28 2016 03:17
you replace the url with the #: href="#"
Jose
@Jjmaster2010
May 28 2016 03:20
this is so much better than any other coding learning site ive ever used. thanks so much bros. @kBashar @lcassettai
CamperBot
@camperbot
May 28 2016 03:20
:cookie: 308 | @lcassettai |http://www.freecodecamp.com/lcassettai
jjmaster2010 sends brownie points to @kbashar and @lcassettai :sparkles: :thumbsup: :sparkles:
:warning: jjmaster2010 already gave kbashar points
lcassettai
@lcassettai
May 28 2016 03:21
no bro! :D
flysky91
@flysky91
May 28 2016 03:22
got stuck at ''' var myStr = "this is the first sentence. ";
myStr += "This is the second sentence. ";''' for long until i noticed its This not this -.-'
CamperBot
@camperbot
May 28 2016 03:22
:bulb: to format code use backticks! ``` more info
charan008
@charan008
May 28 2016 03:22
@RishaBond I tried to center it but couldnt stop the overflow
Khyrul Bashar
@kBashar
May 28 2016 03:23
@flysky91 didn't understand the problem. can you be more specific?
flysky91
@flysky91
May 28 2016 03:24
@kBashar i figured it out. I was just saying that i got stuck at that couldnt fiugre out what was the problem for some time. Then i notice that i put "this" instead of "This"
Khyrul Bashar
@kBashar
May 28 2016 03:25
oh. @flysky91 nice catch
Jonathan Basulto
@JohnBasulto98
May 28 2016 03:25
how do i put a code in the chat
Randy Goggin
@frogshelp
May 28 2016 03:26
copy [aste
oops paste
Jonathan Basulto
@JohnBasulto98
May 28 2016 03:26

<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>
<p font-size: 16px>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Dhaval Ranavasiya
@metaphorG
May 28 2016 03:27
@JohnBasulto98 put the code in CODE
Jonathan Basulto
@JohnBasulto98
May 28 2016 03:27

<<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>

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

idk
Dhaval Ranavasiya
@metaphorG
May 28 2016 03:27
put your code in 3 (`)
and 3(`)
like this
  .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>
<p font-size: 16px>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>>
lcassettai
@lcassettai
May 28 2016 03:28
@JohnBasulto98 delete the first < and the last > you put thats is no necesary'
RishaBond
@RishaBond
May 28 2016 03:29
@charan008 I added a lot of things, but it maybe it will work? :) div .kar{
position: centre; important!
}
lcassettai
@lcassettai
May 28 2016 03:30
@JohnBasulto98 in the second p tag you must style the fonts size like this
<p style="font-size:16px"> your text</p>
charan008
@charan008
May 28 2016 03:31
@RishaBond I tried using overflow:hidden; but i couldnt get output...I tried to use position:center too
RishaBond
@RishaBond
May 28 2016 03:31
@charan008 I really want to help but do not know how :worried: (
charan008
@charan008
May 28 2016 03:33
its okay thank you :D
Youssef Idmoussi
@thegreyfellow
May 28 2016 03:35
hi guys am I the only one or is freecodecamp not working ?!
lcassettai
@lcassettai
May 28 2016 03:36
@charan008 you are using bootstrap?
charan008
@charan008
May 28 2016 03:38
@lcassettai yep
lcassettai
@lcassettai
May 28 2016 03:38
you can use this class "thumbnail" like this
<div class="thumbnail">
  <img  src="https://upload.wikimedia.org/wikipedia/commons/5/57/RamanujanCambridge.jpg" class="img-responsive">
  <div class="caption text-center">Ramanujan (centre) with other scientists at Trinity College</div>
</div>
charan008
@charan008
May 28 2016 03:39
@lcassettai perfect it worked
lcassettai
@lcassettai
May 28 2016 03:40
the second div wasn't closed i just edited
glad to hear!
charan008
@charan008
May 28 2016 03:41
@lcassettai thank you :D
CamperBot
@camperbot
May 28 2016 03:41
charan008 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @lcassettai |http://www.freecodecamp.com/lcassettai
Chris Cullen
@123xylem
May 28 2016 03:43
http://codepen.io/123xylem/pen/xOKZyy?editors=1011 Im wondering How I display Info on Freecodecamp stream given the data call only gives me a small json array with nothing I can make a good display out of
lcassettai
@lcassettai
May 28 2016 03:44
np bro! @charan008 other solution would be this
don't forget to put width to your images
img{
  width:100%;
}
Isaac
@isaacmuchunu
May 28 2016 03:44
<div class="col-xs-4">
<i class="fa"> <button class="btn btn-block btn-primary fa-thumbs-up">Like</button></i>
</div> what could be wrong in those lines4
charan008
@charan008
May 28 2016 03:46
@lcassettai yep I wont next time...apart from that i could get the space for the border line before footer...can you help me with that?
Alex Cortez
@alexthegreat23
May 28 2016 03:48
hey guys i need some help
lcassettai
@lcassettai
May 28 2016 03:50
@isaacmuchunu yous should put the i tag inside the button
  <div class="col-xs-4">
      <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
    </div>
Alex Cortez
@alexthegreat23
May 28 2016 03:52

<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"></a>
</div>
</div>
<img src="https://bit.ly/fcc-running-cats" class="img-responsive">
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-4">
<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">
<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 form-control" placeholder="cat photo URL" required>

<button type="submit btn btn-primary">Submit</button>
</form>
</div>

Isaac
@isaacmuchunu
May 28 2016 03:52
thanks @lcassettai
CamperBot
@camperbot
May 28 2016 03:52
isaacmuchunu sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 310 | @lcassettai |http://www.freecodecamp.com/lcassettai
lcassettai
@lcassettai
May 28 2016 03:52
@charan008 sorry my english is really bad, can you be more especific ?
Alex Cortez
@alexthegreat23
May 28 2016 03:53
i have to do this: Give your form's text input field a class of form-control. Give your form's submit button the classes btn btn-primary. Also give this button the Font Awesome icon of fa-paper-plane
Isaac
@isaacmuchunu
May 28 2016 03:53
you will have them now @camperbot
charan008
@charan008
May 28 2016 03:55
@lcassettai I added border-top to the footer element. but i wanted to have space between the body and border line
lcassettai
@lcassettai
May 28 2016 03:57

@alexthegreat23 you have to add a class form-control, look at your code you add the class inside the type

<input type="text form-control" placeholder="cat photo URL" required>

and you should have this

<input type="text" class="form-control" placeholder="cat photo URL" required>
Noelle Nicol
@nin1524
May 28 2016 03:57
how do i nest text input element within a form element
Isaac
@isaacmuchunu
May 28 2016 03:57
Noelle Nicol
@nin1524
May 28 2016 03:58
how can i nest a text input element in a form element
flysky91
@flysky91
May 28 2016 03:59
@nin1524 that means to put the <input> into the <form>
Noelle Nicol
@nin1524
May 28 2016 03:59
oh ok thanks
flysky91
@flysky91
May 28 2016 03:59
so <form><input></form> i dont want to spoil you everything ;)
Noelle Nicol
@nin1524
May 28 2016 04:00
thank you
flysky91
@flysky91
May 28 2016 04:00
yw
rphares
@rphares
May 28 2016 04:00
Nice hint, @flysky91 ~ ty
CamperBot
@camperbot
May 28 2016 04:00
rphares sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 178 | @flysky91 |http://www.freecodecamp.com/flysky91
rphares
@rphares
May 28 2016 04:00
(and no need to do it back, I'm all good~ :blush:)
flysky91
@flysky91
May 28 2016 04:01
@rphares you again.... go study go sleep why are you on the help channel xD
thank you @rphares
CamperBot
@camperbot
May 28 2016 04:01
flysky91 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4876 | @rphares |http://www.freecodecamp.com/rphares
flysky91
@flysky91
May 28 2016 04:01
you cant escape
rphares
@rphares
May 28 2016 04:01
lollol
flysky91
@flysky91
May 28 2016 04:02
its like darksouls ending, the same. You light the fire or you leave the fire, the result is the same!
rphares @rphares google 'darksouls'
flysky91
@flysky91
May 28 2016 04:04
@rphares ugh you have almost 5k points, are you a pro programmer already?
:D
rphares
@rphares
May 28 2016 04:04
ooh, that sounds kinda fun!
lol, no-- have no intention of being one :wink2:
probably why i have time to hang out in the help channels and learn slowly :blush:
Alex Cortez
@alexthegreat23
May 28 2016 04:06
@lcassettai thank you
CamperBot
@camperbot
May 28 2016 04:06
alexthegreat23 sends brownie points to @lcassettai :sparkles: :thumbsup: :sparkles:
:cookie: 311 | @lcassettai |http://www.freecodecamp.com/lcassettai
Chris Cullen
@123xylem
May 28 2016 04:06
http://codepen.io/123xylem/pen/xOKZyy How can I get my text to not sit under the images? I want my text to start in the top center but the image is making it start in the middle
rphares
@rphares
May 28 2016 04:11
@123xylem -- does it have to do with the order in your JS?
i forked it and messed around with copying pasting your image stuff in that , putting it after the p and all taht-- haven't done that one yet, so not sure what is what, heh, but appears to move around the placement shrug
Chris Cullen
@123xylem
May 28 2016 04:12
@rphares I didnt think so I think its a css thing
lcassettai
@lcassettai
May 28 2016 04:12
@charan008 You must consider the following . The body tag wrap all the page content you want to display in your case you are using the body like a div tag. That will bring future problems. In code pen the body it is seted so you dont have to write the basic html that is this
<!Doctype html>
<html>
 <head>
</head>
<body>
     your code go here in code pen
</body>
</html>
flysky91
@flysky91
May 28 2016 04:13
@123xylem ar you using bootstrap?
rphares
@rphares
May 28 2016 04:14
yeah, but the space in container-fluid is also changing that, too...
Chris Cullen
@123xylem
May 28 2016 04:15
@flysky91 yes
@rphares I tried putting it after the P but no change
rphares
@rphares
May 28 2016 04:16
This message was deleted
This message was deleted
(and some order mucked with...
actually, i just removed the space. that was worse. heh)
charan008
@charan008
May 28 2016 04:19
@lcassettai ok bro ill do the changes :)
lcassettai
@lcassettai
May 28 2016 04:19
@charan008 so change the body tag in your code for a div tag that is the correct way and then add some color to your .main class and you can add some margin-top to separate your footer
no problem :)
flysky91
@flysky91
May 28 2016 04:20
@123xylem I THINK. That you should fix the js code to add a div with row class and then just define a div with class col-md-3 for pic and col-md-9 for the rest. I dont know i ma just guessing:P
APURV SINGH
@apurvvv
May 28 2016 04:24
i don't understand meaning of the question - "Give the text input in your form the class form-control"? what i have to do
flysky91
@flysky91
May 28 2016 04:26
@apurvvv give the <input> the class ="form-control"
i understand what confused you :D
Chris Cullen
@123xylem
May 28 2016 04:27
@flysky91 so your saying in the div their in give it a col md 3 class? Im not totally farmilar with how they work
Jose
@Jjmaster2010
May 28 2016 04:28
how do i nest an input element within a form element
Mark
@frostycoder6796
May 28 2016 04:28
What was the symbol for starting the comment
rphares
@rphares
May 28 2016 04:28
<form stuff><input stuff></form> @Jjmaster2010
<!--
Mark
@frostycoder6796
May 28 2016 04:28
thanks
rphares
@rphares
May 28 2016 04:29
:blush:
Jose
@Jjmaster2010
May 28 2016 04:29
@rphares thanks bud
CamperBot
@camperbot
May 28 2016 04:29
jjmaster2010 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4877 | @rphares |http://www.freecodecamp.com/rphares
flysky91
@flysky91
May 28 2016 04:29
@123xylem with bootstrap you can manage to separate the space for the image and the text <div class="row"><div class="col-md-3">THE IMG</div><div class="col-md-9">the text</div></div>
@rphares thankyou
CamperBot
@camperbot
May 28 2016 04:29
flysky91 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:warning: flysky91 already gave rphares points
rphares
@rphares
May 28 2016 04:29
anytime~
ThaleSelaht
@ThaleSelaht
May 28 2016 04:29
@rphares How much u get paid per question answered? hhahaha
rphares
@rphares
May 28 2016 04:29
lol, only works once an hour ;)
flysky91
@flysky91
May 28 2016 04:29
dayum :D
rphares
@rphares
May 28 2016 04:30
lol, mm, too many brownies? @ThaleSelaht :blush: :wink2:
flysky91
@flysky91
May 28 2016 04:31
@123xylem you use div with class row to define them in 1 row. then you have 12 spaces wich you can set 3 for img and 9 for text eg.
Chris Cullen
@123xylem
May 28 2016 04:33
@flysky91 could you help me further with this? Im unsure on how to start this process
Mark
@frostycoder6796
May 28 2016 04:35
when i am sizing images do i mesh the style for the image with the style for the text?
flysky91
@flysky91
May 28 2016 04:36
@123xylem i can only help you with how your html should look like, i cant help you with js, because i am learning by myself. But as i noticed the js creates the html for you. So i can tell you how the html should look like after its created. Maybe i can try mself
Jonathan Basulto
@JohnBasulto98
May 28 2016 04:36

```

<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>

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

how do i send a code
flysky91
@flysky91
May 28 2016 04:37
@JohnBasulto98 i think that the job was to set the paragraphs to font 16px, if i remember well. You should put in <style> p { font-size:16px; } </style>
Mark
@frostycoder6796
May 28 2016 04:38
i have to downsize an image to 100 pixels but i dont know where to put the new /style command
rphares
@rphares
May 28 2016 04:38
you dont need to make a new one, @frostycoder6796 -- you add the class to the existing <style> section,
Mark
@frostycoder6796
May 28 2016 04:38
do i intertwine it with the previous style or do i make a new one above the img code?\
oh okay
thanks @rphares
CamperBot
@camperbot
May 28 2016 04:39
frostycoder6796 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4878 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 04:39
sure thing~
flysky91
@flysky91
May 28 2016 04:39
@123xylem give me aminute
Chris Cullen
@123xylem
May 28 2016 04:40
@flysky91 thanks
CamperBot
@camperbot
May 28 2016 04:40
123xylem sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 184 | @flysky91 |http://www.freecodecamp.com/flysky91
Mark
@frostycoder6796
May 28 2016 04:40
so i input it as html instead of css
rphares
@rphares
May 28 2016 04:41
no--
<style>
.class-one{
stuff:stuff;
}

.second-class{
stuff:stuff;
}
</style>
then, be sure to apply your new class like normal
<element class = "class-one">Some text! </element>

<img class = "second-class" src = "www.example.com">
Jonathan Basulto
@JohnBasulto98
May 28 2016 04:44
thx @flysky91
CamperBot
@camperbot
May 28 2016 04:44
johnbasulto98 sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 185 | @flysky91 |http://www.freecodecamp.com/flysky91
Mark
@frostycoder6796
May 28 2016 04:44
so do
<img class=all that stuff?
rphares
@rphares
May 28 2016 04:45
everything there is an example,
your image already has a src,
you should have some image in your code right now,
that says
Mark
@frostycoder6796
May 28 2016 04:46
i know its an example, but is that how i start it with <img class
APURV SINGH
@apurvvv
May 28 2016 04:46
@flysky91 thnx a lot !
CamperBot
@camperbot
May 28 2016 04:46
apurvvv sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 186 | @flysky91 |http://www.freecodecamp.com/flysky91
rphares
@rphares
May 28 2016 04:46
yep!
Mark
@frostycoder6796
May 28 2016 04:46
okay thanks @rphares
CamperBot
@camperbot
May 28 2016 04:46
frostycoder6796 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:warning: frostycoder6796 already gave rphares points
rphares
@rphares
May 28 2016 04:47
Anytime~
chetanmahore
@chetanmahore
May 28 2016 04:53
Morning everyone :)
Mark
@frostycoder6796
May 28 2016 04:54
lol its ten at night here
rphares
@rphares
May 28 2016 04:54
same :blush: But hiya, @chetanmahore ~
Daijonna Jenkins
@ghost2999
May 28 2016 04:55
I need help
what do h2 mean
chetanmahore
@chetanmahore
May 28 2016 04:55
hiya, @rphares me, starting out jQuery from where i left. I am pretty hooked :)
Jannette Sanderson
@1jsanderson
May 28 2016 04:56
@ghost2999 h2 means header2
rphares
@rphares
May 28 2016 04:56
<h2> is a type of heading tag, @ghost2999 -- you may see them in the code?
flysky91
@flysky91
May 28 2016 04:56
@123xylem you there?
Philip Eckert
@pae4557
May 28 2016 04:56
@chetanmahore Woah where do you live at???
Jonathan Basulto
@JohnBasulto98
May 28 2016 04:56

<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;
}
</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 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>

chetanmahore
@chetanmahore
May 28 2016 04:57
@pae4557 india
rphares
@rphares
May 28 2016 04:57
Awesome! Go rock it, @chetanmahore ! :blush:
Jonathan Basulto
@JohnBasulto98
May 28 2016 04:57
it says the "Your h2 element should use the font Lobster.
Your h2 element should degrade to the font Monospace when Lobster is not available."
Andrew Lawe
@iriecloud
May 28 2016 04:57
Do we actually have to remember all these elements or do we copy and paste when we get to an advanced stage
rphares
@rphares
May 28 2016 04:57
@JohnBasulto98 , are you on the lesson about switching fonts when ones unavailable ?
flysky91
@flysky91
May 28 2016 04:57
@JohnBasulto98 delete the <!-- at thefont family
that makes that part of code to be a comment and not a code
rphares
@rphares
May 28 2016 04:58
you dont want to comment out the font inside the <style> section,
flysky91
@flysky91
May 28 2016 04:58
<!-- and --> ofc
rphares
@rphares
May 28 2016 04:58
you want to comment out the link up top...
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> this link should be commented out
flysky91
@flysky91
May 28 2016 04:58
@123xylem tell me when you are here i think i figured it out
sawadeesam
@sawadeesam
May 28 2016 05:00
hello everybody
please help me for this
Make your h1 element visible on your page by uncommenting it.
Make your h2 element visible on your page by uncommenting it.
Make your p element visible on your page by uncommenting it.
Be sure to delete all trailing comment tags, i.e. -->.

<h1>Hello World</h1>
<!--no comment-->

<h2>CatPhotoApp</h2>
<!--No comment-->

<p>Hello Paragraph</p>

rphares
@rphares
May 28 2016 05:01
Ah--
it wants you to completely delete the coments
the whole lines like <!--no comment--> can be deleted, @sawadeesam
Chris Cullen
@123xylem
May 28 2016 05:04
@flysky91 yo
flysky91
@flysky91
May 28 2016 05:04
@123xylem figured it out, just give me a second
Chris Cullen
@123xylem
May 28 2016 05:07
yea good one
@flysky91
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:10
<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;
  }
</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 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>
rphares
@rphares
May 28 2016 05:10
<!--Lobster--> should not be commented out,
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> should be...
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:10
it says Your h2 element should use the font Lobster.
Your h2 element should degrade to the font Monospace when Lobster is not available.
Comment out your call to Google for the Lobster font by putting <!-- in front of it. Be sure to close your comment by adding -->.
ok
rphares
@rphares
May 28 2016 05:11
:blush:
its actually pretty easy when you figure it out
rphares
@rphares
May 28 2016 05:11
(and ty for formatting your code, @JohnBasulto98 ! we can help sooo much easier, its very appreciated! )
CamperBot
@camperbot
May 28 2016 05:11
:warning: could not find receiver for johnbasulto98
rphares sends brownie points to @johnbasulto98 :sparkles: :thumbsup: :sparkles:
flysky91
@flysky91
May 28 2016 05:11
you just need some styling
@rphares thank you
CamperBot
@camperbot
May 28 2016 05:11
flysky91 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4879 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 05:12
lol, wthey? @flysky91 , ty back~
CamperBot
@camperbot
May 28 2016 05:12
rphares sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 187 | @flysky91 |http://www.freecodecamp.com/flysky91
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:12
thx for the help @rphares
CamperBot
@camperbot
May 28 2016 05:12
johnbasulto98 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4880 | @rphares |http://www.freecodecamp.com/rphares
rphares
@rphares
May 28 2016 05:13
anytime~
flysky91
@flysky91
May 28 2016 05:13
@rphares you will not win -.- i will send you cookies every hour. I will log in just for that
muahahahhaah
IbrahimSherif
@IbrahimSherif
May 28 2016 05:14
Hello, Sorry if i Interrupt, just want to check the wrong here :
rphares
@rphares
May 28 2016 05:14
lollol, be careful-- I'm infamous for hours logged on gitter, dont start a war you cant win :wink2:
Mark
@frostycoder6796
May 28 2016 05:14

so this confused me when it first came up but everytime you add in a new style for something be sure to also add in a class to the element that your modifying like thi

<h2 class="class1 class2 class3
" just putting this out there for anyone confused like i was

IbrahimSherif
@IbrahimSherif
May 28 2016 05:14

(<style>
h2 {color: blue;} CatPhotoApp
</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>

rphares
@rphares
May 28 2016 05:15
@IbrahimSherif , close, but--
you only need h2 {color: blue;} in the <style> section,
CatPhotoApp belongs below </style>
and it needs its original <h2> </h2> tags,
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:16
Who has attended or attending college here?
rphares
@rphares
May 28 2016 05:16
what happens is, when we want to change the appearance of something through css in the <style> section, @IbrahimSherif
(i have, @JohnBasulto98 , many years ago :wink2: )
IbrahimSherif
@IbrahimSherif
May 28 2016 05:16
yah i got it thanks
i'm stell at highschool
rphares
@rphares
May 28 2016 05:16
oh, okay then--
congrats and happy coding!
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:17
i just graduated from high school
starting college in September
rphares
@rphares
May 28 2016 05:17
Oooh , congrats!
IbrahimSherif
@IbrahimSherif
May 28 2016 05:17
thanks
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:17
its scary
rphares
@rphares
May 28 2016 05:17
Must be excited~ :blush: Near home, or on campus? @JohnBasulto98
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:17
near home
rphares
@rphares
May 28 2016 05:18
heh, yeah, that too-- but it'll be awesome, dont be nervous-- its an amazing opportunity to cram in lots of learning and lots of life experience :blush:
Mark
@frostycoder6796
May 28 2016 05:18
@JohnBasulto98 what is your degree?
Jacob Henley
@JacobHenley
May 28 2016 05:19

Hey guys I am trying to make a font awesome icon showup and can't quite figure out where I am going wrong. Here is the code I am working thru:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>

<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>

</div>

<div class="collapse navbar-collapse" id="navbar-collapse-1">


<ul class="nav nav-tabs navbar-default ">


<li role="presentation"><a href="#" role="button" aria-haspopup="true" aria-expanded="false"><button class="btn btn-block"><span><i class="fa fa-home"></i></span></button></a>

</li>

<li role="presentation" class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Community</a>
<ul class="dropdown-menu">

<li><a class="dropdown-item" href="#">Recent Activity</a></li>
<div class="dropdown-divider"></div>
<li><a class="dropdown-item" href="#">Member Forum</a></li>
<li><a class="dropdown-item" href="#">Member List</a></li>
<li><a class="dropdown-item" href="#">Member Groups</a></li>
</ul>
</li>

<li role="presentation" class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Pet Help</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Ask at your own risk!</a></li>
</ul>
</li>

<li role="presentation" class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Pets for Sale</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Rocking Lizards!</a></li>
</ul>
</li>
<li role="presentation" class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Pet Services</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Grooming</a></li>
</ul>
</li>

</ul>
</div>
</div>
</nav>

Mark
@frostycoder6796
May 28 2016 05:19
daaaaammmmnnnn talk bout getting supprised xD
that is a lot of code
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:20
Right now I'm going for Computer Engineering B.S.or Mathematics B.A.
yup
Manish Giri
@Manish-Giri
May 28 2016 05:20
@JohnBasulto98 all the best!
Jacob Henley
@JacobHenley
May 28 2016 05:20
@frostycoder6796 Yea I am just starting so not really sure which piece that is making the error
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:21
yea @Manish-Giri i want to double major
flysky91
@flysky91
May 28 2016 05:21
@JacobHenley Pinpointus the icon you want to show, what part of code is it here. The bars?
Jacob Henley
@JacobHenley
May 28 2016 05:22
@flysky91 Its the first tab on the nav bar: the fa fa-home icon wont show

@flysky91 <li role="presentation"><a href="#" role="button" aria-haspopup="true" aria-expanded="false"><button class="btn btn-block"><span><i class="fa fa-home"></i></span></button></a>

</li>

Eldar Tinjić
@EldarT90
May 28 2016 05:23
anyone here can help with reactjs+json ?
Daijonna Jenkins
@ghost2999
May 28 2016 05:24
@1jsanderson @rphares thanks for the help
CamperBot
@camperbot
May 28 2016 05:24
ghost2999 sends brownie points to @1jsanderson and @rphares :sparkles: :thumbsup: :sparkles:
:cookie: 109 | @1jsanderson |http://www.freecodecamp.com/1jsanderson
:star2: 4881 | @rphares |http://www.freecodecamp.com/rphares
T. Lauren Cremeans
@icartusacrimea
May 28 2016 05:25
Hello! Will someone help me with my Twitter and Facebook buttons on my code generator? I can't figure out how to get them in line and with the same style floating left at the top. Thank you! http://codepen.io/LaerTrech/pen/YWKbvw
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:27
<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">

<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>
flysky91
@flysky91
May 28 2016 05:27
<i class="fa fa-home" aria-hidden="true"></i> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"/>
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:27
it says Your img element should have the class smaller-image.
Your image should be 100 pixels wide. Browser zoom should be at 100%.
flysky91
@flysky91
May 28 2016 05:27
@JacobHenley
@JacobHenley you dont need <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css"> that is if you have it on your pc. and you put the link for the older font awesome the 4.1 try to put htis <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"/>
Manish Giri
@Manish-Giri
May 28 2016 05:28
@JohnBasulto98 you forgot to apply the class here -
<img src="https://bit.ly/fcc-relaxing-cat">
flysky91
@flysky91
May 28 2016 05:28
i am not sure if it will fix it
Jacob Henley
@JacobHenley
May 28 2016 05:29
@flysky91 That works! The icon is showing up now! Thanks for the help. Now I just need to make it look the same size as the other nav tabs.
CamperBot
@camperbot
May 28 2016 05:29
jacobhenley sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 188 | @flysky91 |http://www.freecodecamp.com/flysky91
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:31
@Manish-Giri i dont follow
flysky91
@flysky91
May 28 2016 05:32
@JacobHenley you can use that by adding fa-2x or 3x or 5x or lg for very small as a class so for example class="fa fa-home fa-5x" will make it 5 times bigger. And you are welcome
Manish Giri
@Manish-Giri
May 28 2016 05:33
@JohnBasulto98 you’ve got to apply the class smaller-image to the image, else how would it be resized
<img class=“smaller-image” src="https://bit.ly/fcc-relaxing-cat">
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:33
oh yea
do you need the ""
<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">

<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>
thx @Manish-Giri
CamperBot
@camperbot
May 28 2016 05:37
johnbasulto98 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 1134 | @manish-giri |http://www.freecodecamp.com/manish-giri
Eldar Tinjić
@EldarT90
May 28 2016 05:38
need help with reactJS
Manish Giri
@Manish-Giri
May 28 2016 05:39
@JohnBasulto98 welc
soumya sharma
@soumya41096
May 28 2016 05:43

<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"></a>
</div>
</div>
<img src="https://bit.ly/fcc-running-cats" class="img-responsive">
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-4">
<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>
it says nest all your radio button in single div class row n each button with div class col-xs-6 .where am i wrong? :( help please

rphares
@rphares
May 28 2016 05:44
these are your radio buttons, @soumya41096 :
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
so you see them?
they should be nested, each with its own div (with the class col-xs-6) and those two divs should be nested in one row
ROW
soumya sharma
@soumya41096
May 28 2016 05:45
hehe.oops. thank you
silly mistake.
rphares
@rphares
May 28 2016 05:46
no problem~
Amro
@666machine
May 28 2016 05:46
Hello everyone, I need some help here
task number 77
Your h2 element and topmost img element should both be nested together within a div element with the class row.
I don't get it.
How do I nest again?
T. Lauren Cremeans
@icartusacrimea
May 28 2016 05:47
Hello! Will someone help me with my Twitter and Facebook buttons on my code generator? I can't figure out how to get them in line and with the same style floating left at the top. Thank you! http://codepen.io/LaerTrech/pen/YWKbvw
Floating right*
I've tried just about everything
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:48
<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" class="thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

<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>
need help
rphares
@rphares
May 28 2016 05:48
div with class row opens
h2 opens and closes
image opens and closes
close div
@666machine
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:48
"Your img element should have the class smaller-image.
Your img element should have the class thick-green-border.
Give your image a border width of 10px.
Give your image a border style of solid.
The border around your img element should be green."
rphares
@rphares
May 28 2016 05:48
@JohnBasulto98 , all the classes go in one set of class = "all-the classes-here"
for example <img class= "first-class second-class">
you have them separate <img class="smaller-image" class="thick-green-border"
Amro
@666machine
May 28 2016 05:50
@rphares okay another question
so basically the function of div is for example we want to have 3 sections....
and it divides them into 3 portions left middle and right?
rphares
@rphares
May 28 2016 05:51
mm, no... its like a container...
(please note: many peopler very critical of w3schools, so you may prefer to google on your own~)
Amro
@666machine
May 28 2016 05:52
so whats the difference between div and the container?
rphares
@rphares
May 28 2016 05:52
container-fluid is a bootstrap class,
it requires bootstrap, for one thing...
Amro
@666machine
May 28 2016 05:53
oh that makes sense (Y)
any other differences?
rphares
@rphares
May 28 2016 05:53
you'll wanna read up on bootstrap seperately-- its beloved by many of the less designy, more backend tech types in our main chat here,
but,
im not our go-to on theory/idea stuff, sorry
also a beginner~
Coy Sanders
@coymeetsworld
May 28 2016 05:54
div is a HTML tag, container is a class that comes from the CSS Bootstrap framework that you can apply to a div
so basically div is HTML, container is CSS. HTML and CSS do two different things
rphares
@rphares
May 28 2016 05:55
i :yellow_heart: you just now...
Amro
@666machine
May 28 2016 05:55
Thanks @coymeetsworld and @rphares
CamperBot
@camperbot
May 28 2016 05:55
666machine sends brownie points to @coymeetsworld and @rphares :sparkles: :thumbsup: :sparkles:
:cookie: 975 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:star2: 4882 | @rphares |http://www.freecodecamp.com/rphares
Leow Wei Xiang
@boyboi86
May 28 2016 05:55
Dear all kindly advise if you can make appendTo effects better here is my pen: http://codepen.io/Boyboi86/full/oLvLxB/
Coy Sanders
@coymeetsworld
May 28 2016 05:55
:) @rphares
rphares
@rphares
May 28 2016 05:55
Wb and ty, @coymeetsworld ~ terrified of answering anything that isn't just a waypoint!
CamperBot
@camperbot
May 28 2016 05:55
rphares sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:cookie: 976 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
May 28 2016 05:56
lol yeah sometimes people ask some real hard questions about JavaScript and I can shrivel up
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:58
<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" "thick-green-border" src="https://bit.ly/fcc-relaxing-cat">


<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>
im not sure how to put them together
@rphares
T. Lauren Cremeans
@icartusacrimea
May 28 2016 05:59
Why won't anyone help me?
gaikin
@gaikin
May 28 2016 05:59
<img class="smaller-image thick-green-border"
Jonathan Basulto
@JohnBasulto98
May 28 2016 05:59
neve rmind
yea @gaikin
lol
@gaikin still thx @rphares
CamperBot
@camperbot
May 28 2016 06:00
johnbasulto98 sends brownie points to @gaikin and @rphares :sparkles: :thumbsup: :sparkles:
:cookie: 9 | @gaikin |http://www.freecodecamp.com/gaikin
:warning: johnbasulto98 already gave rphares points
rphares
@rphares
May 28 2016 06:01
heh, everyones got ya covered~ Congrats and happy coding~
Coy Sanders
@coymeetsworld
May 28 2016 06:03
what do you need help w/ @icartusacrimea ?
help brownie points
CamperBot
@camperbot
May 28 2016 06:04

:point_right: brownie points [wiki]

Brownie Points

The number beside your picture on Free Code Camp tells you how many Brownie Points you have.

A user profile picture next to a with Brownie Points score

There are two ways you can get Brownie Points:

  1. Complete challenges - you get one point per challenge you complete
  2. Help other campers in chat - each time you help another camper and they thank you (by typing "thanks @yourname"), you will get a point

Brownie Points help you look like the kind of person who codes a lot, shares relevant links, and helps people.

They also add to your Streak.

:pencil: read more about brownie points on the FCC Wiki

Coy Sanders
@coymeetsworld
May 28 2016 06:04
@666machine
Amro
@666machine
May 28 2016 06:04
brilliant (Y)
thanks @coymeetsworld
CamperBot
@camperbot
May 28 2016 06:04
666machine sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:warning: 666machine already gave coymeetsworld points
Coy Sanders
@coymeetsworld
May 28 2016 06:05
yeah np
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:05
how do i do this "Your image should have a border radius of 10px"
Amro
@666machine
May 28 2016 06:05
so how many do you have?
I'm at "Use Spans for Inline Elements" wtb u?
Coy Sanders
@coymeetsworld
May 28 2016 06:05
all of them :)
Amro
@666machine
May 28 2016 06:05
could you tell me how many are they?
or at least how far have I reached approx?
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:07
<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;
  }

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

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

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

<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>
how do i do this "Your image should have a border radius of 10px"
Coy Sanders
@coymeetsworld
May 28 2016 06:08
check out freecodecamp.com/map @666machine
that will show you where you're at and show you whats to come
gaikin
@gaikin
May 28 2016 06:08
border-radius: 10px
Jose Camilo
@pradius
May 28 2016 06:08
border-radius: 10px
Coy Sanders
@coymeetsworld
May 28 2016 06:08
yeah put that into the smaller-image class definition @JohnBasulto98
what @gaikin and @pradius said, but with semi-colon at end of course
Amro
@666machine
May 28 2016 06:09
@JohnBasulto98
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 10px;
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:09
oh
Amro
@666machine
May 28 2016 06:09
}
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:09
i see
thx @coymeetsworld @gaikin @pradius
CamperBot
@camperbot
May 28 2016 06:10
johnbasulto98 sends brownie points to @coymeetsworld and @gaikin and @pradius :sparkles: :thumbsup: :sparkles:
:warning: johnbasulto98 already gave gaikin points
:cookie: 57 | @pradius |http://www.freecodecamp.com/pradius
:cookie: 977 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Amro
@666machine
May 28 2016 06:10
@coymeetsworld thanks xD
CamperBot
@camperbot
May 28 2016 06:10
666machine sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:warning: 666machine already gave coymeetsworld points
Coy Sanders
@coymeetsworld
May 28 2016 06:10
yeah, check out the instructions on the side @JohnBasulto98 and read them well, they usually give you an idea of what to put in
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:13
@coymeetsworld my friend wants to go to the college you attended
I wanted Cal Poly Pomona
Thomas Nguyen
@thomasnguyen
May 28 2016 06:13
hey guys i have a question
Coy Sanders
@coymeetsworld
May 28 2016 06:13
why Pomona over SLO @JohnBasulto98 ?
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:14
Closer
Thomas Nguyen
@thomasnguyen
May 28 2016 06:14
so if i want to make a div clickable and then have it display html on click
how would i do it
Jose Camilo
@pradius
May 28 2016 06:14
maybe
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:14
closer to home
Jose Camilo
@pradius
May 28 2016 06:14
I guess you would need to nest it in a anchor tag?
a
Coy Sanders
@coymeetsworld
May 28 2016 06:15
but SLO is nice @JohnBasulto98 :)
nice weather, nice city, learned alot there too
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:16
sounds nice too
But i got weightlisted so ehhhh whatever
Thomas Nguyen
@thomasnguyen
May 28 2016 06:17
<a href="">
            <div class="col-md-3 col-xs-6" id="col1">
                <img class="imgicon" src="http://i.imgur.com/TNRqU6G.png"><br>
                EDUCATION
            </div>
  </a>

<script>
 $("#col1").on("click", function(){
                    $("#col1").html("lol");
                });
</script>
^that should work right
oh whoops sorry if the indention is weird but i click on the div and no worky
Leow Wei Xiang
@boyboi86
May 28 2016 06:17

can someone help me with this problem. whenever I hover, it does seem i can change opacity to 1, i tried with z-indexing doesn't work.

this is not a zipline, it's just a project i did for practice.

http://codepen.io/Boyboi86/full/vGQQMW/

Coy Sanders
@coymeetsworld
May 28 2016 06:18
yeah not end of the world @JohnBasulto98 but if you had a choice, but in the end depends on what you want to learn
some criticisms I had though was that SLO had quarter system, which I loathed
Rube
@rubenlomakin
May 28 2016 06:18
Hey I'm on "Inherit Styles from the Body Element" and I need help with giving my body element the color green, and to make my h1 element inherit color from the body element.
Coy Sanders
@coymeetsworld
May 28 2016 06:19
you can't go undeclared, and very hard to switch majors. They wanted you not to jump around alot, just wanted you to focus get your degree and start working, which I can respect
flysky91
@flysky91
May 28 2016 06:19
@boyboi86 you want to change the opacity of the picture, when you hover over it?
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:20
aren't all CSU'S are in Quater Systems
Jose Camilo
@pradius
May 28 2016 06:20
@rubenlomakin whats the question
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:20
i like it
Coy Sanders
@coymeetsworld
May 28 2016 06:20
don't believe so @JohnBasulto98, but idk I graduated in 08, things could've changed between now and then
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:20
more faster
Coy Sanders
@coymeetsworld
May 28 2016 06:20
yeah well you won't be saying that when you get midterms in week 4 lol
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:21
true
Rube
@rubenlomakin
May 28 2016 06:21
How do I make my element inherit something?
flysky91
@flysky91
May 28 2016 06:21
@boyboi86 The opacity property can take a value from 0.0 - 1.0. The lower value, the more transparent. so try adding this to your css img:hover {opacity:0.3;}
captain22
@captain22
May 28 2016 06:21
hi guys i need help
Coy Sanders
@coymeetsworld
May 28 2016 06:21
but not the worst thing in the world either, think I would've liked Semester a little better but no regrets, wouldn't go anywhere else if i had 2nd chance
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:21
@coymeetsworld where did you grew up?
flysky91
@flysky91
May 28 2016 06:22
@captain22 hi, ask
rphares
@rphares
May 28 2016 06:22
@captain22 , on what?
Coy Sanders
@coymeetsworld
May 28 2016 06:22
northern California
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:22
Southern California
flysky91
@flysky91
May 28 2016 06:22
@rphares thank you!
CamperBot
@camperbot
May 28 2016 06:22
flysky91 sends brownie points to @rphares :sparkles: :thumbsup: :sparkles:
:star2: 4883 | @rphares |http://www.freecodecamp.com/rphares
captain22
@captain22
May 28 2016 06:22
i made smaller image... thing to that kitty like .smaller-image {
width: 100px;
Coy Sanders
@coymeetsworld
May 28 2016 06:22
ah
rphares
@rphares
May 28 2016 06:22
lollol, no ty, @flysky91 ~
CamperBot
@camperbot
May 28 2016 06:22
rphares sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
:cookie: 191 | @flysky91 |http://www.freecodecamp.com/flysky91
rphares
@rphares
May 28 2016 06:23
Okay! could you show us your full code, @captain22 ? :blush:
Coy Sanders
@coymeetsworld
May 28 2016 06:23
SLO was the furthest I've lived south lol
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:23
yea im starting college in September
captain22
@captain22
May 28 2016 06:23

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

<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 src="https://bit.ly/fcc-relaxing-cat">

<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>

Jonathan Basulto
@JohnBasulto98
May 28 2016 06:23
really
Coy Sanders
@coymeetsworld
May 28 2016 06:23
nice congrats, where you thinking of going?
Jonathan Basulto
@JohnBasulto98
May 28 2016 06:23
CSUSB
flysky91
@flysky91
May 28 2016 06:23
@coymeetsworld @JohnBasulto98 dont get me wrong guys can you make that conversation private, it makes a mess here
rphares
@rphares
May 28 2016 06:23
very close, but you need to apply that class to your image, @captain22
you made the class in your <style> section,
captain22
@captain22
May 28 2016 06:24
yep
rphares
@rphares
May 28 2016 06:24
the next step is to add it to <img src="https://bit.ly/fcc-relaxing-cat">
captain22
@captain22
May 28 2016 06:24
to where
rphares
@rphares
May 28 2016 06:24
you do that like this-- i will add the class "fake-class" to an image
<img class = "fake-class" src = "www.example.com">
see how i added class = and the class name to my image?
captain22
@captain22
May 28 2016 06:24
i understand
rphares
@rphares
May 28 2016 06:25
cool-- give it a go and let us know if you are still stuck~
Lidiya Nikolova
@l-emi
May 28 2016 06:25
Hey guys how do I make the contact form narrower? It's too wide now and I'd prefer it to wrap around the input fields better. http://codepen.io/l-emi/pen/PzoZPX/
ThaleSelaht
@ThaleSelaht
May 28 2016 06:25
@rphares still 'working'? I love our community cuz people like u
rphares
@rphares
May 28 2016 06:25
Toooo kind, @ThaleSelaht ~ Thank you! :blush:
CamperBot
@camperbot
May 28 2016 06:25
rphares sends brownie points to @thaleselaht :sparkles: :thumbsup: :sparkles:
:cookie: 224 | @thaleselaht |http://www.freecodecamp.com/thaleselaht
rphares
@rphares
May 28 2016 06:25
almost bed-tie for me, though~
captain22
@captain22
May 28 2016 06:26
so i add <img width="https://bit.ly/fcc-relaxing-cat"> to under </style> part
did i do right?
rphares
@rphares
May 28 2016 06:26
not quite,
captain22
@captain22
May 28 2016 06:26
:D lol
rphares
@rphares
May 28 2016 06:27
you will want to delete that that you added just now, lemme try again
.red-text {
color: red;
}
.smaller-image {
width: 100px;
}
h2 {
font-family: Lobster, Monospace;
}

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

.fake-class {
width: 10px;
}
</style>

<img class= "fake-class" src="https://bit.ly/fcc-relaxing-cat">
@captain22 , in the example above,
i took the <style> section you had made,
and added a class, named fake class
i also took the image from your code,
and applied my new class, "fake-class"
by adding class = "fake-class"
when we make classes in our style section, we have to also tell our code which parts we want to apply them to, by adding class = and the class name to the html tag :blush:
now, that image is 10px, because i applied "fake-class".... you dont want that, though. You made the class smaller-image, so you should apply that in the same way to your image~
captain22
@captain22
May 28 2016 06:30
<img class="width" src="https://bit.ly/fcc-re....">???
rphares
@rphares
May 28 2016 06:30
not "width"
what is the name of the class you made?
.smaller-image {
width: 100px;
}
captain22
@captain22
May 28 2016 06:31
i did :D thanks man
rphares
@rphares
May 28 2016 06:32
anytime~ Congrats and happy coding, @captain22 :blush:
captain22
@captain22
May 28 2016 06:32
it is my first day at coding btw so dont expect much :D
what do u suggest for a first-timer?
rphares
@rphares
May 28 2016 06:32
nope-- dont worry about it at all-- hard things to get our heads around, and you got it without anyone telling you the answer~
mm,hard to say-- we all learn differently-
ThaleSelaht
@ThaleSelaht
May 28 2016 06:33
@captain22 first day rly? awesome, record this day
rphares
@rphares
May 28 2016 06:33
for me, I'm also a beginner, a few months in-
when i was starting, i did FCC, and also did the same materials on other free sites for repetition,
and i took notes
but thats me
others just breeze through and get it quicker shrug
Coy Sanders
@coymeetsworld
May 28 2016 06:33
some people breeze too fast @rphares :)
captain22
@captain22
May 28 2016 06:34
are u a computer engineer or a high school student?
Coy Sanders
@coymeetsworld
May 28 2016 06:34
see people jumping already to Back-End cert and don't know anything about JavaScript :worried:
rphares
@rphares
May 28 2016 06:34
lol, me-- neither. I'm evil edu management and just learning for fun :blush: :wink2:
captain22
@captain22
May 28 2016 06:35
well thats nice
from where?
rphares
@rphares
May 28 2016 06:35
Im american,
mostly worked in asia, taking a break now and deciding whats next :blush:
you?
heh, yeah... dont know how they can, I'm both impressed and worried for them... @coymeetsworld
flysky91
@flysky91
May 28 2016 06:36
@rphares how much time did it took you to finish teh full code camp
captain22
@captain22
May 28 2016 06:36
from Turkey, im at a private high school
rphares
@rphares
May 28 2016 06:36
lol, I'm no where near finished, @flysky91 ~
flysky91
@flysky91
May 28 2016 06:36
yes you are i can smell it
captain22
@captain22
May 28 2016 06:36
it says more than 2000 hours, or something...
Leow Wei Xiang
@boyboi86
May 28 2016 06:36
@flysky91 doesn't work neither. but thanks for effort though
CamperBot
@camperbot
May 28 2016 06:36
boyboi86 sends brownie points to @flysky91 :sparkles: :thumbsup: :sparkles:
flysky91
@flysky91
May 28 2016 06:36
liar
CamperBot
@camperbot
May 28 2016 06:36
:cookie: 192 | @flysky91 |http://www.freecodecamp.com/flysky91
flysky91
@flysky91
May 28 2016 06:37
@boyboi86 it works for me
do you want the image
to get lower opacity like transparent?
Coy Sanders
@coymeetsworld
May 28 2016 06:37
@rphares yeah little worried for them too
Santak Mishra
@santakmishra
May 28 2016 06:37
This message was deleted
Coy Sanders
@coymeetsworld
May 28 2016 06:37
remember one guy saying he finished like 150 challenges one day, and wanted to know how to go faster
and I'm like dude lol, slow down you don't have to get the certification tomorrow
hes like "No, i want it now" hahaha
Leow Wei Xiang
@boyboi86
May 28 2016 06:38
@flysky91 do you have a pen I can see?
captain22
@captain22
May 28 2016 06:38
wtf how can he go that much fast
Tay Jing Yong
@Blazer433
May 28 2016 06:38

''''<script>
$(document).ready(function(){
$('button').addClass('animated-button');
$(''.btn'').addClass('shake-button');
$('#target1').addClass('btn-primary');

});
</script>''''

CamperBot
@camperbot
May 28 2016 06:38
:bulb: to format code use backticks! ```