These are chat archives for FreeCodeCamp/Help

7th
Jun 2016
Stephane
@overmelo
Jun 07 2016 00:00
@khalilFCB you wrote "cat-photo-app" instead of cat-photo-form
khalilFCB
@khalilFCB
Jun 07 2016 00:02
this is what i write : <form action="/submit-cat-photo" id="cat-photo-form"> i add the id but it doesn't work
Stephane
@overmelo
Jun 07 2016 00:06
@khalilFCB paste your whole code
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:09
guys, im stuck at Lobster font in training
that font wasnt exist anymore, so didnt load well
stilesrdl
@stilesrdl
Jun 07 2016 00:10
im still doing something wrong @overmelo @efeselgr this is the code i got so far
<img class="smaller-image"{width:100px;} src="https://bit.ly/fcc-relaxing-cat"></img>
efeselgr
@efeselgr
Jun 07 2016 00:10
@stilesrdl remove the "{width....}"
Patirck
@SomeRandom42
Jun 07 2016 00:11
Hi I am having a problem with the cat app thing (sorry if not descriptive) I am not sure hove to give p elements a font size of 16
efeselgr
@efeselgr
Jun 07 2016 00:11
you have already told the program that it should make 100px when somethng has the class "smaller-image"
Antoine
@antoine3990
Jun 07 2016 00:11
p { font-size: 16px }
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:11

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

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

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

that lobster font didnt work, whats the problem?

efeselgr
@efeselgr
Jun 07 2016 00:11

@SomeRandom42 do

<style>
p{
font-size:16px;

Stephane
@overmelo
Jun 07 2016 00:11
@irurrahman did you u remove that link above?
@irurrahman where is your html code?
efeselgr
@efeselgr
Jun 07 2016 00:12

@SomeRandom42 do

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

that way computer gives all the paragraphs 16px font size

Willie Chapman
@willechapman
Jun 07 2016 00:13
Hello I'm trying to set a dead link by going from this:
Faizan A
@FaizanA1234
Jun 07 2016 00:13
Any help on how to begin the tribute page? :worried:
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:13
@overmelo still wont work

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

p {
font-size: 16px;
font-family: Monospace;
h2 {
font-family: Lobster;
}
}
</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>

Stephane
@overmelo
Jun 07 2016 00:13
close your p{
Sean DiSanti
@badc0ded
Jun 07 2016 00:13
@FaizanA1234 begin tribute page by deciding who it will be about
Stephane
@overmelo
Jun 07 2016 00:13
@stilesrdl sorted?
stilesrdl
@stilesrdl
Jun 07 2016 00:13
its still not setting the image to 100px. heres the code after removing width '''<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat"></img>'''
CamperBot
@camperbot
Jun 07 2016 00:13
:bulb: to format code use backticks! ``` more info
Stephane
@overmelo
Jun 07 2016 00:14
@willechapman add # to your href
Antoine
@antoine3990
Jun 07 2016 00:14
@willechapman <a href="#"></a>
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:14
@overmelo well, thanks
CamperBot
@camperbot
Jun 07 2016 00:14
irurrahman sends brownie points to @overmelo :sparkles: :thumbsup: :sparkles:
:cookie: 336 | @overmelo |http://www.freecodecamp.com/overmelo
Faizan A
@FaizanA1234
Jun 07 2016 00:14
@badc0ded already decided! but where do I begin coding? Just need to find out where to start
stilesrdl
@stilesrdl
Jun 07 2016 00:14
still working on it @overmelo its not setting the image to 100 px
'''<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat"></img>'''
CamperBot
@camperbot
Jun 07 2016 00:15
:bulb: to format code use backticks! ``` more info
Stephane
@overmelo
Jun 07 2016 00:15
@stilesrdl remove </img>
@stilesrdl and u need to give us your whole code
Dylan
@tddaniel114
Jun 07 2016 00:17
<img class="smaller-image" "thick-green-border" src="https://bit.ly/fcc-relaxing-cat"> ---- anybody see a problem with this line?
efeselgr
@efeselgr
Jun 07 2016 00:17
@tddaniel114 classes are wrong
put smaller-image and thick-green-border in the class="here" together,with space between them
Dylan
@tddaniel114
Jun 07 2016 00:18
I'm not sure what you mean
oic
Faizan A
@FaizanA1234
Jun 07 2016 00:18
any help on tribute page?
Dylan
@tddaniel114
Jun 07 2016 00:18
so i don't need two sets of parentheses
or quotes i mean
efeselgr
@efeselgr
Jun 07 2016 00:18
class="smaller-image thick-green-border"
Antoine
@antoine3990
Jun 07 2016 00:18
@tddaniel114 try adding a slash at the end of your img tag to close it <img ... ></img> and your classes must be in the same "", separated by spaces
Dylan
@tddaniel114
Jun 07 2016 00:18
you rock!
thanks. I may not have ever tried that..
stilesrdl
@stilesrdl
Jun 07 2016 00:19

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

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

efeselgr
@efeselgr
Jun 07 2016 00:20
@stilesrdl computer wants to give your <img> element the class "smaller-image" but it can't find it in between <style> </style>
Stephane
@overmelo
Jun 07 2016 00:20
@stilesrdl you havent called your class on <style> . do it as you have done with red-text
efeselgr
@efeselgr
Jun 07 2016 00:21
i don't know maybe gives it but smaller-image does nothing even if computer does give it to
Stephane
@overmelo
Jun 07 2016 00:22
sure it can't change
stilesrdl
@stilesrdl
Jun 07 2016 00:23
got it!! @efeselgr @overmelo thank you you for your patience and help! love breaking through the brick wall thank you both!
CamperBot
@camperbot
Jun 07 2016 00:23
stilesrdl sends brownie points to @efeselgr and @overmelo :sparkles: :thumbsup: :sparkles:
:cookie: 156 | @efeselgr |http://www.freecodecamp.com/efeselgr
:cookie: 337 | @overmelo |http://www.freecodecamp.com/overmelo
efeselgr
@efeselgr
Jun 07 2016 00:23
@stilesrdl ur welcome
Stephane
@overmelo
Jun 07 2016 00:24
congrats
J. Kilgore
@jkilgore07
Jun 07 2016 00:24
@efeselgr how did you do that screenshot? ive tried paint,print key, snip tool. cant seem to get it to work?
efeselgr
@efeselgr
Jun 07 2016 00:24
@jkilgore07 what do you mean?
ashanti21
@ashanti21
Jun 07 2016 00:26

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>

J. Kilgore
@jkilgore07
Jun 07 2016 00:26
@efeselgr how you showed creative-shin your code.
ashanti21
@ashanti21
Jun 07 2016 00:26
Can someone tell me whats wrong with this code?
efeselgr
@efeselgr
Jun 07 2016 00:26
@jkilgore07 it's gitter's feature,check the right bottom of your chat screen.
M with down arrow
iccomq
@iccomq
Jun 07 2016 00:26
help ```
CamperBot
@camperbot
Jun 07 2016 00:26

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

iccomq
@iccomq
Jun 07 2016 00:27
eh camperbot youre useless
efeselgr
@efeselgr
Jun 07 2016 00:27
@ashanti21 nothing
Willie Chapman
@willechapman
Jun 07 2016 00:27
Try to make a dead link turning this: <p>Click here for <a href="http://www.freecatphotoapp.com">cat photos</a>.</p> to this: <p>Click here for <a href="#">cat photos</a>.</p>
Stephane
@overmelo
Jun 07 2016 00:29
@willechapman a dead link where? make sure u have located the proper place
J. Kilgore
@jkilgore07
Jun 07 2016 00:29
@efeselgr so do you switch to compose mode, then copy and paste the screenshot in?
efeselgr
@efeselgr
Jun 07 2016 00:29
@jkilgore07 no you just copy and paste the code
Stephane
@overmelo
Jun 07 2016 00:29
@ashanti21 refresh ur page maybe
taitii
@taitii
Jun 07 2016 00:29
Algorithm BONFIRENAME
J. Kilgore
@jkilgore07
Jun 07 2016 00:29

<script>
$(document).ready(function()$("button").addclass("animated bounce");{

});
</script>

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target animated bounce" id="target1">#target1</button>
<button class="btn btn-default target animated bounce" id="target2">#target2</button>
<button class="btn btn-default target animated bounce" 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 animated bounce" id="target4">#target4</button>
<button class="btn btn-default target animated bounce" id="target5">#target5</button>
<button class="btn btn-default target animated bounce" id="target6">#target6</button>
</div>
</div>
</div>
</div>

Stephane
@overmelo
Jun 07 2016 00:30
help format
CamperBot
@camperbot
Jun 07 2016 00:30

: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

Willie Chapman
@willechapman
Jun 07 2016 00:31
@overmelo I tried to place (#) after <a href=>
Stephane
@overmelo
Jun 07 2016 00:35
@willechapman you have 2 <p> do it to the others one. hence my sayings, make sure u have located the right place to put it
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:35
<!--
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
-->

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

  h2 {
    font-family: Lobster, Monospace;
  }

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

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

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

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

<p>View More <a>Cat Photos</a></p>

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

<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>
Your a element should be nested within your new p element.
Your p element should have the text "View more " (with a space after it)
wheres the fault? o.o
iccomq
@iccomq
Jun 07 2016 00:38
This message was deleted
efeselgr
@efeselgr
Jun 07 2016 00:38
i think you should add href
<p>View More <a href="http://www.freecatphotoapp.com">Cat photos</a></p>
like so
iccomq
@iccomq
Jun 07 2016 00:39
jesus im blind,
:D
as @efeselgr said you forgot about href
Myles Farkash
@HurleyDaze
Jun 07 2016 00:40
dead link using has symbol ?
hash*
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:41
@efeselgr thanks, nested things was solved. but "Your p element should have the text "View more " (with a space after it)" wasnt
CamperBot
@camperbot
Jun 07 2016 00:41
irurrahman sends brownie points to @efeselgr :sparkles: :thumbsup: :sparkles:
:cookie: 161 | @efeselgr |http://www.freecodecamp.com/efeselgr
Myles Farkash
@HurleyDaze
Jun 07 2016 00:41
take out href replace with # or add it onto it or something?
J. Kilgore
@jkilgore07
Jun 07 2016 00:41
can someone tell me whats wrong about this code please? Its the target html elements with selectors using jquery. My buttons all bounce like they should but it still has the "use jquery addclass() function to give the classes animated and bounce to your button elements" with an x.

<script>
$(document).ready(function()$("button").addclass("animated bounce"); {

});
</script>

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<h4>#left-well</h4>
<div class="well" id="left-well">
<button class="btn btn-default target animated bounce" id="target1">#target1</button>
<button class="btn btn-default target animated bounce" id="target2">#target2</button>
<button class="btn btn-default target animated bounce" 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 animated bounce" id="target4">#target4</button>
<button class="btn btn-default target animated bounce" id="target5">#target5</button>
<button class="btn btn-default target animated bounce" id="target6">#target6</button>
</div>
</div>
</div>
</div>

Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:41
@iccomq hehe thanks for your attention :)
CamperBot
@camperbot
Jun 07 2016 00:41
irurrahman sends brownie points to @iccomq :sparkles: :thumbsup: :sparkles:
:cookie: 411 | @iccomq |http://www.freecodecamp.com/iccomq
efeselgr
@efeselgr
Jun 07 2016 00:42
@irurrahman i don't know why
about the <p>
CamperBot
@camperbot
Jun 07 2016 00:42
you need to ask about @someone!
Stephane
@overmelo
Jun 07 2016 00:42
@jkilgore07 addClass capital C
efeselgr
@efeselgr
Jun 07 2016 00:43
@jkilgore07 not sure but i think your function is in wrong place
Stephane
@overmelo
Jun 07 2016 00:43

this is wrong also: $(document).ready(function()$("button").addclass("animated bounce"); {

});

i guess
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:43
@efeselgr me too, that code seems no mistake. how can i finish the callange tho :v
efeselgr
@efeselgr
Jun 07 2016 00:43
@irurrahman lemme send you my code and compare it
challenge name?
J. Kilgore
@jkilgore07
Jun 07 2016 00:44
@overmelo i did captile C on class. its saying SyntaxError: Unexpected identifier
efeselgr
@efeselgr
Jun 07 2016 00:44
@jkilgore07 remove this ->"$("button").addclass("animated bounce"); "
ashanti21
@ashanti21
Jun 07 2016 00:44

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>

I keep receiving an error for this module it says "be sure to delete all trailing comment tag, i.e" can anyone help me I dont see anything wrong with it but I am very new lol

efeselgr
@efeselgr
Jun 07 2016 00:45
@jkilgore07 and add it after the "{"
@ashanti21 give me challenge name
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 00:45
@efeselgr solved, theres 2 line was double paste. my mistake lol
ashanti21
@ashanti21
Jun 07 2016 00:46
@efeselgr Uncomment HTML
efeselgr
@efeselgr
Jun 07 2016 00:47
@ashanti21 delete the arrows at the top and at the bottom
Doug
@dburwell
Jun 07 2016 00:47
hello
efeselgr
@efeselgr
Jun 07 2016 00:47
@dburwell hi
Doug
@dburwell
Jun 07 2016 00:47
need help
ashanti21
@ashanti21
Jun 07 2016 00:48
@efeselgr still no luck but thanks.
CamperBot
@camperbot
Jun 07 2016 00:48
ashanti21 sends brownie points to @efeselgr :sparkles: :thumbsup: :sparkles:
:cookie: 163 | @efeselgr |http://www.freecodecamp.com/efeselgr
efeselgr
@efeselgr
Jun 07 2016 00:49
@ashanti21 take this

<h1>Hello World</h1>


<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>
Doug
@dburwell
Jun 07 2016 00:49
I'm trying to create the smaller-image class but its not working out for me
J. Kilgore
@jkilgore07
Jun 07 2016 00:49
@efeselgr that worked! also had to take out the bootstrap class animated bounce on each button since it said only use jquery. Thank you!
CamperBot
@camperbot
Jun 07 2016 00:49
jkilgore07 sends brownie points to @efeselgr :sparkles: :thumbsup: :sparkles:
:cookie: 164 | @efeselgr |http://www.freecodecamp.com/efeselgr
efeselgr
@efeselgr
Jun 07 2016 00:49
@jkilgore07 ur welcome
Willie Chapman
@willechapman
Jun 07 2016 00:51
@overmelo ok figured it out thanks!!
CamperBot
@camperbot
Jun 07 2016 00:51
willechapman sends brownie points to @overmelo :sparkles: :thumbsup: :sparkles:
:cookie: 338 | @overmelo |http://www.freecodecamp.com/overmelo
ashanti21
@ashanti21
Jun 07 2016 00:51
@efeselgr THANKS! Not sure what I was doing wrong, but it worked.
CamperBot
@camperbot
Jun 07 2016 00:51
ashanti21 sends brownie points to @efeselgr :sparkles: :thumbsup: :sparkles:
:warning: ashanti21 already gave efeselgr points
Ilir Tagani
@CodeHunter24
Jun 07 2016 00:53
hey everyone, does anyone have a second to help me? I'm just a little confused haha. I'm learning the form element in html and am stuck. This is what i am tasked with doing: "Nest your text input element within a form element."
Dylan Snyder
@dylan-snyder
Jun 07 2016 00:54
Good evening, everyone.
@CodeHunter24 Nesting is placing a block inside of another block. For example, your <body> tag (and everything else as well) is nested in the <html> tag.
J. Kilgore
@jkilgore07
Jun 07 2016 00:55
@dburwell make sure you are creating it within your <style> </style> element. for example: <style> .smaller-image { width: 20px; }</style> it can be anywhere in your style element. make sure you use the value its asking for in front of the px
Ilir Tagani
@CodeHunter24
Jun 07 2016 00:56
thank you @dylan-snyder! will be back if it doesn't help. very much appreciated
CamperBot
@camperbot
Jun 07 2016 00:56
codehunter24 sends brownie points to @dylan-snyder :sparkles: :thumbsup: :sparkles:
:cookie: 6 | @dylan-snyder |http://www.freecodecamp.com/dylan-snyder
J. Kilgore
@jkilgore07
Jun 07 2016 00:56
@dburwell css classes start with a period
Dylan Snyder
@dylan-snyder
Jun 07 2016 00:57
@CodeHunter24 great, let me know if you need any more help!
gyrhawk
@gyrhawk
Jun 07 2016 00:57
I need help with the "bootstrap fluid containers"
I don't understand what I need to do to activate or use the class="fluid-container" usually to use a class you have to place .fluid-conainer {parameters specified} in a style somewhere. I just don't know where to start.
efeselgr
@efeselgr
Jun 07 2016 00:59
@gyrhawk nononono
@gyrhawk you do not define fluid-container,it's already in the bootstrap and is defined
@gyrhawk you just use it
@gyrhawk <div class="fluid-containers"> like so
gyrhawk
@gyrhawk
Jun 07 2016 01:00
ok, so I just need the div element, did that, then I need to use <div class:"container-fluid"> right
but its not responding
efeselgr
@efeselgr
Jun 07 2016 01:00
no ":"
"="
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:00
@gyrhawk nitpicking, make sure you use "=" instead of ":"
gyrhawk
@gyrhawk
Jun 07 2016 01:01
nice, can't believe i missed that, been a long day! Appreciate the help!
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:03
@gyrhawk no worry, good luck
J. Kilgore
@jkilgore07
Jun 07 2016 01:06
@dburwell did you figure it out?
J. Kilgore
@jkilgore07
Jun 07 2016 01:24
Just a clarification question, since <button> is its own element i dont need a period before it in $("button") since i want it to apply to the whole button, but since "well" is nested in a "div" element i need the period before it like this $(."well") to specify on the well within the "div" element? would it mess up the code in the "div" since it would also apply to the "id" within the "div"? <div class="well" id="left-well">
<button class="btn btn-default target" id="target1">#target1</button>
hnry
@hnry
Jun 07 2016 01:25
$(".well") applies to every element with the class 'well'
the period has nothing to do with nesting, it means match on class
J. Kilgore
@jkilgore07
Jun 07 2016 01:30
@hnry gotcha. button doesnt need the period since its not matching a class, rather an element. period means class, no period means element. At least to this point lol. Thank you!
CamperBot
@camperbot
Jun 07 2016 01:30
jkilgore07 sends brownie points to @hnry :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @hnry |http://www.freecodecamp.com/hnry
hnry
@hnry
Jun 07 2016 01:30
you got it! that's exactly it
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:30
Haha I'm not new to coding, but I am new to gitter. How do I give someone a brownie point?
Alan H
@alaaaaaaaaan
Jun 07 2016 01:31
hello coders! I am currently struggling between when to use class= vs style= does anyone have a good resource that explains it or maybe even have a good explanation themselves? I hate having to google which to use every time i write code lol
Alexander Køpke
@alexanderkopke
Jun 07 2016 01:31
@dylan-snyder click someone's name and say thanks, thank you or something similar
CamperBot
@camperbot
Jun 07 2016 01:31
alexanderkopke sends brownie points to @dylan-snyder :sparkles: :thumbsup: :sparkles:
:cookie: 19 | @dylan-snyder |http://www.freecodecamp.com/dylan-snyder
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:31
@alexanderkopke thanks! ;)
CamperBot
@camperbot
Jun 07 2016 01:31
dylan-snyder sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:cookie: 665 | @alexanderkopke |http://www.freecodecamp.com/alexanderkopke
Alexander Køpke
@alexanderkopke
Jun 07 2016 01:32
:)
Connor Hastey-Palindat
@cpalindat
Jun 07 2016 01:34
Can anyone help me with getting two divs side by side? http://codepen.io/cpalindat/pen/EyjeJZ
I can't get the logo and the game title side by side in this, im trying to use inline block?
hnry
@hnry
Jun 07 2016 01:35
@ConnHurr use the css style float: left
Connor Hastey-Palindat
@cpalindat
Jun 07 2016 01:36
Will that still work if there is more then two?
hnry
@hnry
Jun 07 2016 01:37
oh since you're using bootstrap, just put them in the same row and make it columns?
Connor Hastey-Palindat
@cpalindat
Jun 07 2016 01:37
@hnry oh I forgot about that...oops! thank you!
CamperBot
@camperbot
Jun 07 2016 01:37
connhurr sends brownie points to @hnry :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @hnry |http://www.freecodecamp.com/hnry
efeselgr
@efeselgr
Jun 07 2016 01:39
@ConnHurr hi i made 3 boxes in a 100px box and made them collumns with bootstrap,but they are not in the middle of the box horizontally,how do i make it?
Tom Sharkey
@tbsharkey
Jun 07 2016 01:40
I'm having trouble with the Prioritize One Style Over Another page
Namely applying pink text to a h1 element when the color is set to green
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:41
@efeselgr can you post your code? (look up GitHub formatting if needed!)
DCFOS
@DCFOS
Jun 07 2016 01:41
Hey there.
I understand this exercise : https://www.freecodecamp.com/challenges/create-a-form-element
But if I were to create a real site, what would the url be? How would I find it?
efeselgr
@efeselgr
Jun 07 2016 01:42
@dylan-snyder want me to send the codepen?tho it's long.
DCFOS
@DCFOS
Jun 07 2016 01:42
Maybe, does anyone knows a good free hosting or something so I can test the exercise in "real situation"?
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:43
@tbsharkey, inline style takes preference over code in an external style sheet or style tag inside an html docutment, if that helps.
@efeselgr sure, or you can personal message me the code if you do not want to post it here
Tom Sharkey
@tbsharkey
Jun 07 2016 01:44
@dylan-snyder so how would I change the text to pink on <h1>Hello World!</h1>
DCFOS
@DCFOS
Jun 07 2016 01:45
<h1 style="color: pink">Hello World</h1>
If I'm not mistaken
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:45
@tbsharkey a simple, inline style way to do that would to be <h1 style="color: pink">Hello World!</h1>
Daniel
@profoundhub
Jun 07 2016 01:45
@ConnHurr @efeselgr Here is the link to how to center in CSS : http://howtocenterincss.com/
DCFOS
@DCFOS
Jun 07 2016 01:45
but I'm a beginner
@tbsharkey
Tom Sharkey
@tbsharkey
Jun 07 2016 01:46
yes me too, I haven't been keeping up like I should but I completed 12 steps today
Daniel
@profoundhub
Jun 07 2016 01:47
@tbsharkey good for you :) step by step, you will make it :)
Alan H
@alaaaaaaaaan
Jun 07 2016 01:47
Anyone have a good way of remembering when to use class= vs style=?
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:47
@tbsharkey practice makes perfect, good job!
Tom Sharkey
@tbsharkey
Jun 07 2016 01:49
Well that took 1 out of three checks
it says my h1 element should have the class pink-text
and <style> should have a pink-text CSS class with its color set to pink
wouldn't that be .pink-text:pink;?
Daniel
@profoundhub
Jun 07 2016 01:50
@tbsharkey I'll send you a PM with something helpful
DCFOS
@DCFOS
Jun 07 2016 01:51
oh ok then it's a diffeent method than the style= Tom. I had a bit of trouble with that too. You have to create a CSS at the beginning of the document (using <style>), that contains the .pink-text class
and then you can apply that pink-text class to each line (h, p) that you want to, by typing for example <h2 class="pink-text">
Not sure if I'm clear, english is not my first language sorry
Tom Sharkey
@tbsharkey
Jun 07 2016 01:52
that would be like <style> .pink-text:pink; </style>
DCFOS
@DCFOS
Jun 07 2016 01:53
Not exactly, wait
<style>
.red-text {
color: red;
}
something like that
Dylan Snyder
@dylan-snyder
Jun 07 2016 01:54
Nitpicking; make sure to add ending </style> tag.
DCFOS
@DCFOS
Jun 07 2016 01:54
and then you can add other parameters beyong color after that, inside the CSS
*beyond
like font, etc
but you'll see that right after in the exercises
Yeah of course @dylan-snyder ;)
Tom Sharkey
@tbsharkey
Jun 07 2016 01:58
I guess I'm confused when to use {}
Archangelpak
@Archangelpak
Jun 07 2016 01:59
guys please help Im stuck with the grid element in bootstrap
Jonathan Aldas
@jonaadas
Jun 07 2016 01:59

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

<p>Things cats love:</p>

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

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

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

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

<form action="/submit-cat-photo"></form>

Hello people i do not know how to do this step
"Nest your text input element within a form element."
can somebody help
thank you :D
Archangelpak
@Archangelpak
Jun 07 2016 01:59
Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
DCFOS
@DCFOS
Jun 07 2016 02:00
@tbsharkey about the {}, do you mean the placement of it? Or the situation in which it's useful?
Dylan Snyder
@dylan-snyder
Jun 07 2016 02:00
@jonaadas Don't forget you can use GitHub markdown or Codepen to make your code more condensed and readable here! ;)
Archangelpak
@Archangelpak
Jun 07 2016 02:00
<button class="btn btn-block btn-primary">Like</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-info">Info</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-danger">Delete</button>
<div class="col-xs-4"></div>
</div>
Connor Hastey-Palindat
@cpalindat
Jun 07 2016 02:00
@hnry Not sure if you're still around (or anyone else who can help) but the cols seem not to be working? http://codepen.io/cpalindat/pen/EyjeJZ
Tom Sharkey
@tbsharkey
Jun 07 2016 02:01
@DCFOS the place,emt
placement
Jonathan Aldas
@jonaadas
Jun 07 2016 02:03
@dylan-snyder okay thank you
CamperBot
@camperbot
Jun 07 2016 02:03
jonaadas sends brownie points to @dylan-snyder :sparkles: :thumbsup: :sparkles:
:cookie: 21 | @dylan-snyder |http://www.freecodecamp.com/dylan-snyder
DCFOS
@DCFOS
Jun 07 2016 02:03
@tbsharkey Yeah it was weird to me too. Just learn it by heart like it's presented in the lesson and it'll become "normal" ;)
Tom Sharkey
@tbsharkey
Jun 07 2016 02:04
I call them squiggly lines
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 02:04
whats the different between abbreviate and abbreviated?

<style>
  .red-text {
    color: #F00 
  }
  .fuchsia-text {
    color: #F0F;
  }
  .cyan-text {
    color: #0FF;
  }
  .green-text {
    color: #0F0;
  }
</style>

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

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

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

<h1 class="green-text">I am green!</h1>
uncompleted "Use the abbreviate hex code for the color red instead of the hex code #FF0000."
marvoldo
@marvoldo
Jun 07 2016 02:07
any please help me with "Create a Set of Checkboxes" lesson?
Archangelpak
@Archangelpak
Jun 07 2016 02:08
anyone doing this? Use the Bootstrap Grid to Put Elements Side By Side
aqeel710
@aqeel710
Jun 07 2016 02:09
yes
Marques Traylor
@Marques12343
Jun 07 2016 02:09
@marvoldo what do you need help with specifically?
aqeel710
@aqeel710
Jun 07 2016 02:09
@maaz93 i have done that recently , how can i help ?
@Archangelpak you mean using columns?
marvoldo
@marvoldo
Jun 07 2016 02:10
@Marques12343 i have done it right now :) thanks all the same :)
CamperBot
@camperbot
Jun 07 2016 02:10
marvoldo sends brownie points to @marques12343 :sparkles: :thumbsup: :sparkles:
:cookie: 48 | @marques12343 |http://www.freecodecamp.com/marques12343
Archangelpak
@Archangelpak
Jun 07 2016 02:11
I @aqeel710 yep Im stuck wit this task: Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
aqeel710
@aqeel710
Jun 07 2016 02:11
yes
first you need to group elements in one row and that should be in div with class of row
Archangelpak
@Archangelpak
Jun 07 2016 02:12
@aqeel710 code is here : <button class="btn btn-block btn-primary">Like</button>
<button class="btn btn-block btn-info">Info</button>
<button class="btn btn-block btn-danger">Delete</button>
I did it
aqeel710
@aqeel710
Jun 07 2016 02:13
@Archangelpak you got it done correctly ? 😊
Archangelpak
@Archangelpak
Jun 07 2016 02:14
@aqeel710 give me just a sec I will send u my code
William Hedrick
@BillHedrick
Jun 07 2016 02:14

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

<h2 class='red-text'>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>

Archangelpak
@Archangelpak
Jun 07 2016 02:14
@aqeel710 I deleted accidently
William Hedrick
@BillHedrick
Jun 07 2016 02:15
curious to how to turn my h2 element red
Marques Traylor
@Marques12343
Jun 07 2016 02:15
@BillHedrick you dont need the h2 in there since you already assigned the class 'red-text' to it
@BillHedrick all you need is .red-text { color:red; }
Alvin
@alve24
Jun 07 2016 02:16
Hi, i put
William Hedrick
@BillHedrick
Jun 07 2016 02:16
makes since the challenge already had he h2 in removed it and done
thanks! @Marques12343
CamperBot
@camperbot
Jun 07 2016 02:16
billhedrick sends brownie points to @marques12343 :sparkles: :thumbsup: :sparkles:
:cookie: 49 | @marques12343 |http://www.freecodecamp.com/marques12343
Alvin
@alve24
Jun 07 2016 02:16
sorry messed up. But does anyone know how to make a smaller-image class?
I made it like this
Marques Traylor
@Marques12343
Jun 07 2016 02:17
@BillHedrick to make a class for an element you put the class attribute followed by the class name in quotes so , <img class = "smaller-image">
@BillHedrick woops wrong person lol
that was to @alve24
Alvin
@alve24
Jun 07 2016 02:17
@BillHedrick Thank you very much
CamperBot
@camperbot
Jun 07 2016 02:17
alve24 sends brownie points to @billhedrick :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for billhedrick
Alvin
@alve24
Jun 07 2016 02:18
@Marques12343 Thank you
CamperBot
@camperbot
Jun 07 2016 02:18
alve24 sends brownie points to @marques12343 :sparkles: :thumbsup: :sparkles:
:cookie: 50 | @marques12343 |http://www.freecodecamp.com/marques12343
Archangelpak
@Archangelpak
Jun 07 2016 02:18
@aqeel710 here is my code: <div class="col-xs-4"></div>
<button class="btn btn-block btn-primary">Like</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-info">Info</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-danger">Delete</button>
</div>
wait
<div class="row">
<div class="col-xs-4"></div>
<button class="btn btn-block btn-primary">Like</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-info">Info</button>
<div class="col-xs-4"></div>
<button class="btn btn-block btn-danger">Delete</button>
</div>
aqeel710
@aqeel710
Jun 07 2016 02:20
@Archangelpak just second
Archangelpak
@Archangelpak
Jun 07 2016 02:20
@aqeel710 sure
Marques Traylor
@Marques12343
Jun 07 2016 02:20
@Archangelpak you need to put the button element inside the div col element, which is also called "nesting", so <div class = 'col-xs-4'><button element here></div>
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 02:22
@irurrahman thanks
CamperBot
@camperbot
Jun 07 2016 02:22
sorry irurrahman, you can't send brownie points to yourself! :sparkles: :sparkles:
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 02:22
lel
aqeel710
@aqeel710
Jun 07 2016 02:23
you should group your buttons elements in one div with class row
then inside that dive .. for each button there should be div with class col xs 4 @Archangelpak
Andrew
@collegetiger
Jun 07 2016 02:24
anyone know why my portfolo div element went to the top? It is supposed to be below everything that’s why it’s last, it’s driving me crazy trying to fix it, no i dont have a clear understanding of floats and clears but I am thinking that’s the issue, I dont know. http://codepen.io/collegetiger/pen/wWvOmX
its the .port div that needs to be below the picture and paragraph
Archangelpak
@Archangelpak
Jun 07 2016 02:25
thank you very much guys I solve it
aqeel710
@aqeel710
Jun 07 2016 02:26
good .. no worries 😊
William Hedrick
@BillHedrick
Jun 07 2016 02:30

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

<h2 class='red-text'>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>

Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
stumped again this course is much harder than codeacadamy and jumps right into it deeper and faster!

<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> Purr jump eat the grass</p>

this set of code
oneruhel
@oneruhel
Jun 07 2016 02:42
hi
aqeel710
@aqeel710
Jun 07 2016 02:42
This message was deleted
This message was deleted
marvoldo
@marvoldo
Jun 07 2016 02:45

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

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

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

Danny
@kurdi82
Jun 07 2016 02:45
I am stuck at this problem
Your a element should be a dead link with a href attribute set to "#".
marvoldo
@marvoldo
Jun 07 2016 02:45
do you see any problem with that code
???
Danny
@kurdi82
Jun 07 2016 02:45
how do I fix it?
marvoldo
@marvoldo
Jun 07 2016 02:45
how could i make "hello world" pink?
Emmanuel Ezima
@eezima
Jun 07 2016 02:46
this is my code

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

<div class="container-fluid>">

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

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

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

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

aqeel710
@aqeel710
Jun 07 2016 02:46
< h1 class=" " > hello world </h1> @marvoldo
Emmanuel Ezima
@eezima
Jun 07 2016 02:46
the instruction is to
"To get started, we should nest all of our HTML in a div element with the class container-fluid."
Danny
@kurdi82
Jun 07 2016 02:46
marvoldo ... you use the color:red;
marvoldo
@marvoldo
Jun 07 2016 02:47
@kurdi82 ????
Emmanuel Ezima
@eezima
Jun 07 2016 02:48
please what am i doing wrong in the code
Danny
@kurdi82
Jun 07 2016 02:48
oh i'm sorry .. color:pink;
aqeel710
@aqeel710
Jun 07 2016 02:49

<div class="container-fluid>"> this should be

<div class="container-fluid">

@eezima

Archangelpak
@Archangelpak
Jun 07 2016 02:50

@eezima <div class="container-fluid">

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

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

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

<p>Things cats love:</p>

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

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

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

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

@eezima try this
codecraze143
@codecraze143
Jun 07 2016 02:50
Hi
i need help in coding html5 and css
i need to add another P element with some text and in the below same style tag i need to create an entry for P element and set it's font-size to 16px

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

Danny
@kurdi82
Jun 07 2016 02:52
marvoldo
you got it?
codecraze143
@codecraze143
Jun 07 2016 02:52
nope
Emmanuel Ezima
@eezima
Jun 07 2016 02:53
thanks @aqeel710 and @Archangelpak it was a typo, just seen it
CamperBot
@camperbot
Jun 07 2016 02:53
eezima sends brownie points to @aqeel710 and @archangelpak :sparkles: :thumbsup: :sparkles:
:cookie: 91 | @aqeel710 |http://www.freecodecamp.com/aqeel710
:cookie: 75 | @archangelpak |http://www.freecodecamp.com/archangelpak
Steve Witman
@stevewitman
Jun 07 2016 02:53
getting this message "Your p element should have the text "View more " (with a space after it)." ... anybody see a mistake?
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

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

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

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

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

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

<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>View More <a href="http://www.freecatphotoapp.com">Cat photos</a></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>
codecraze143
@codecraze143
Jun 07 2016 02:54
got it
thanks :)
Archangelpak
@Archangelpak
Jun 07 2016 02:54
@eezima glad u solve it :-)
Sean DiSanti
@badc0ded
Jun 07 2016 02:55
looks good to me @stevewitman try refreshing page and resubmitting
aqeel710
@aqeel710
Jun 07 2016 02:55
welcome any time ! @eezima
Archangelpak
@Archangelpak
Jun 07 2016 02:56
@stevewitman name html css section pls

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

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

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

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

@stevewitman try to have a space after <p>View more(space) <a href="
William Hedrick
@BillHedrick
Jun 07 2016 03:02

help again with point #4|

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

CamperBot
@camperbot
Jun 07 2016 03:02
no wiki entry for: again with point 41--you need 2 p elements with kitty ipsum text2--make sure each of your p elements has a closing tag3--your p element should contain the first few words of the provided additional kitty ipsum text4--do not add a class attribute to the second p element5--between the style tags give the p elements font-size of 16px browser and text zoom should be at 100
William Hedrick
@BillHedrick
Jun 07 2016 03:02

<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> Purr jump eat the grass</p>

Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
Steve Witman
@stevewitman
Jun 07 2016 03:07
@Archangelpak thanks. I had the space ... I tried refreshing, different browsers, and still didn't have luck until copy/paste your code. Can't see what is different yet, must be late. I will let you know if I find it. Thanks!
CamperBot
@camperbot
Jun 07 2016 03:07
stevewitman sends brownie points to @archangelpak :sparkles: :thumbsup: :sparkles:
:cookie: 76 | @archangelpak |http://www.freecodecamp.com/archangelpak
Archangelpak
@Archangelpak
Jun 07 2016 03:08

@stevewitman

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

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

w @stevewitman my whole code
Lydia Kim
@minylk
Jun 07 2016 03:12

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

<h1>Hello World!</h1>

HELP!
CamperBot
@camperbot
Jun 07 2016 03:12

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

Dolan
@dguh
Jun 07 2016 03:12
@badc0ded hey sean declaring the variables in the function worked
Lydia Kim
@minylk
Jun 07 2016 03:12
Your h1 element should have the class pink-text.
Your <style> should have a pink-text CSS class with its color set to pink.
:(
Dolan
@dguh
Jun 07 2016 03:13
thanks for your help
Sean DiSanti
@badc0ded
Jun 07 2016 03:13
no problem, i'm glad i could help
Archangelpak
@Archangelpak
Jun 07 2016 03:15
@minylk <h1 class="pink-text</h1>
@minylk css is : .pink-text { color: pink; }
@minylk let me know if it helps
Steve Witman
@stevewitman
Jun 07 2016 03:22

@Archangelpak
It looks like the problem was that I kept

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

and also had added

<p>View More <a href="http://www.freecatphotoapp.com">Cat photos</a></p>

instead of just putting the <p> tag around the existing link.

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

and also had added

<p>View More <a href="http://www.freecatphotoapp.com">Cat photos</a></p>

instead of just putting the <p> tag around the existing link.

Thanks for the help!

CamperBot
@camperbot
Jun 07 2016 03:22
stevewitman sends brownie points to @archangelpak :sparkles: :thumbsup: :sparkles:
:warning: stevewitman already gave archangelpak points
Hugo Melo
@squanto
Jun 07 2016 03:24
For exact change (https://www.freecodecamp.com/challenges/exact-change), it says 'Return the string "Insufficient Funds" if cash-in-drawer is less than the change due. ‘ should the function return "Insufficient Funds” if there isn’t exact change, or just total cash in the drawer?
Archangelpak
@Archangelpak
Jun 07 2016 03:24
@stevewitman glad u solve it :-)
MaoApp
@maoapp
Jun 07 2016 03:25
why is no working

function lookUpProfile(firstName, prop){

// Only change code below this line
for(var i=0;i<contacts.length;i++)
if(contacts[i].firstName==firstName)
{
if(contacts[i][prop])
{

      return contacts[i].prop;
    }
  else
    {
      return "No such property";
    }




}

else
{
return "No such contact";
}
// Only change code above this line
}

Justin
@jhadams82
Jun 07 2016 03:31
hello, i could use a hand with somethin
anybody out there?
Hugo Melo
@squanto
Jun 07 2016 03:32
what’s up @jhadams82
Justin
@jhadams82
Jun 07 2016 03:35
@squanto i'm working on the weather API. i knew this wasn't the right chat room, but i was gettin no love in the frontend room so i was gonna try here
but lo and behold, somebody helped me out over there just now =)
Hugo Melo
@squanto
Jun 07 2016 03:35
nice
Justin
@jhadams82
Jun 07 2016 03:36
yeah, FYI: you gotta use the HTTPS version of codepen.io if you want that stuff to work. easy fix
(that stuff = geolocation)
rockydd
@rockydd
Jun 07 2016 03:39
Hi guys, Is it possible to finish my challenges all in my iPhone?
Justin
@jhadams82
Jun 07 2016 03:40
lol, wow. maybe, but geez. sounds pretty tedious
why?
rockydd
@rockydd
Jun 07 2016 03:42
Want to get these done on my way to work or waiting in the line... :smile:
Andrew Gelston
@agelston6
Jun 07 2016 03:42
good evening, who knows about <i> elements?
I'm stuck on a challenfe
*challenge
Justin
@jhadams82
Jun 07 2016 03:44
nice. yeah, i've done a few that way myself. gotta squeeze the juice out of every day, huh? =D yeah, i don't see why not. but yeah, it's rough. podcasts and articles might be a better use of your time in those situations, i think
@agelston6 hit me =)
Austin Elder
@AustinElder
Jun 07 2016 03:44
Hey guys, I had a question about animate.css With animate.css, I can add a class of "animated bounce" to html elements. what happened to classes needing to be one continuous word? I thought html and css didnt read white spaces, so why does it seem to suddenly work now?
Justin
@jhadams82
Jun 07 2016 03:45
animated and bounce would be two separate classes
white space lets you add multiple classes to one element
Austin Elder
@AustinElder
Jun 07 2016 03:45
ah, so that one effect is derived from two different classes working together?
Justin
@jhadams82
Jun 07 2016 03:45
yep, exactly =)
Austin Elder
@AustinElder
Jun 07 2016 03:45
awesome, thanks
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 03:46
about @jhadams82
CamperBot
@camperbot
Jun 07 2016 03:46
:cookie: 372 | @jhadams82 |http://www.freecodecamp.com/jhadams82
DCFOS
@DCFOS
Jun 07 2016 03:47

https://www.freecodecamp.com/challenges/give-a-background-color-to-a-div-element

Done that one, so I get how to change the bg color of a div element, but how would you chnage the general bg color? Do I have to create a general div, where I will apply the general bg color, or is there another way?

Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 03:47
@irurrahman about
DCFOS
@DCFOS
Jun 07 2016 03:50
Nevermind, I tested it, it works like that, maybe there's another method but whatevs
Justin
@jhadams82
Jun 07 2016 03:55
@DCFOS you mean change the bg color of the body element?
DCFOS
@DCFOS
Jun 07 2016 03:56
Oh, I don't think Ive learned about a body element @jhadams82
Justin
@jhadams82
Jun 07 2016 03:57
yeah, body is the main element of the page. put a background-color on it and try it out =) i think that's what you're looking for
DCFOS
@DCFOS
Jun 07 2016 04:00
@jhadams82 Yes, thanks! That's actually the right thing. But it wasn't in the lessons I think
CamperBot
@camperbot
Jun 07 2016 04:00
dcfos sends brownie points to @jhadams82 :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @jhadams82 |http://www.freecodecamp.com/jhadams82
DCFOS
@DCFOS
Jun 07 2016 04:00
Or maybe I forgot it ^^;
Justin
@jhadams82
Jun 07 2016 04:01
yeah, it all runs together sometime, lol
DCFOS
@DCFOS
Jun 07 2016 04:01
(or maybe it just comes in a later part, anyway)
wenhui-lei
@wenhui-lei
Jun 07 2016 04:02
Only use jQuery to add these class to the element.
What it means?
skilescm
@skilescm
Jun 07 2016 04:04
@wenhui-lei use a jQuery statement to add a class name
$("p:first").addClass("intro");
wenhui-lei
@wenhui-lei
Jun 07 2016 04:05

yes and i did it

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

but it still tell me "Only use jQuery to add these class to the element." T_T
skilescm
@skilescm
Jun 07 2016 04:06
did you add the class names in your html?
Justin
@jhadams82
Jun 07 2016 04:07
$(".btn ").ad... maybe take that whitespace out?
$(".btn").ad...
@wenhui-lei
wenhui-lei
@wenhui-lei
Jun 07 2016 04:08
blob
skilescm
@skilescm
Jun 07 2016 04:09
try removing the "animated" class from your buttons
then re-run it
Pat
@Beingpat
Jun 07 2016 04:09
Hi guys..
skilescm
@skilescm
Jun 07 2016 04:09
@Beingpat hey!!
Pat
@Beingpat
Jun 07 2016 04:10
I am stuck at catapp photo
skilescm
@skilescm
Jun 07 2016 04:10
whats the problem?
Pat
@Beingpat
Jun 07 2016 04: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;
}
.smaller-image {
width: 100px;
}
.thick-green-borer {
border-color: green;
border-width: 10px;
border-style: solid;
}

</style>

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

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

<p class="red-text">Kitty ipsum dolor sit amet, 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>

when I add class to images its does not work
skilescm
@skilescm
Jun 07 2016 04:11
what are you trying to achieve?
Pat
@Beingpat
Jun 07 2016 04:11
am I doing anything wrong.
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
skilescm
@skilescm
Jun 07 2016 04:11
add the class between img and src
wenhui-lei
@wenhui-lei
Jun 07 2016 04:11
Oh yes !!!you're right!!! thank you!!!!!
i removed it and it work! thank you!!!
skilescm
@skilescm
Jun 07 2016 04:11
@wenhui-lei awesome
@Beingpat also, you only use one class=" "
class="smaller-image thick-green-border"
Pat
@Beingpat
Jun 07 2016 04:13
Oh thank you. Let me try.
and how do i change the boder width and make it solid. ?
FM
@mafelix
Jun 07 2016 04:15
border-style: solid
border-width: 104121239102412px;
skilescm
@skilescm
Jun 07 2016 04:15
@mafelix , I'm totally using those setting on my next page... ha!
*settings
FM
@mafelix
Jun 07 2016 04:16
don't forget the ';' i didn't put in the first line
Justin
@jhadams82
Jun 07 2016 04:19
lmao, whoa
what will that do? will it break?
Pat
@Beingpat
Jun 07 2016 04:19
@mafelix that works thanx just started the coding and enjoying...
CamperBot
@camperbot
Jun 07 2016 04:19
beingpat sends brownie points to @mafelix :sparkles: :thumbsup: :sparkles:
:cookie: 180 | @mafelix |http://www.freecodecamp.com/mafelix
skilescm
@skilescm
Jun 07 2016 04:20
@jhadams82 my guess is a lot of scrolling...
Pat
@Beingpat
Jun 07 2016 04:20
@mafelix Ok
Thomas Hodges
@thodges314
Jun 07 2016 04:22
Has anyone had issues with the <audio> tag on mobile browsers?
Dylan
@tddaniel114
Jun 07 2016 04:23
Hey - is anyone else having issues with being able to place the cursor correctly on the bottom line of the text editor?
Thomas Hodges
@thodges314
Jun 07 2016 04:25
I'm working on my Simon project. It works perfectly so far on my laptop, including when I shrink the windows down to less than 500 px width to activate that CSS. The audio is not working, though, and I think that that is crashing my javascript (because I use .play() and .pause() to start and stop pre-loaded audio objects).
skilescm
@skilescm
Jun 07 2016 04:26
@tddaniel114 in the challenges? I've come to understand that it isn't going to type whee I put it and usuallly start with a space...lol
*where
Jo
@yun-zee
Jun 07 2016 04:27
Hi everyone, i'm a bit stuck on this part of the code: "Give the text input in your form the class form-control."
<form>
<button type="submit" class="btn btn-primary" >Submit> <input class="form-control"> <i class="fa fa-paper-plane"> </i> </button>
</form>
skilescm
@skilescm
Jun 07 2016 04:30
@yun-zee doesn't the input need a type="text"?
Kamal Dewangan
@kamal231
Jun 07 2016 04:30
https://www.freecodecamp.com/challenges/link-to-external-pages-with-anchor-elements#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%0A%0A%0A%0A%3Cp%20class%3D%22red-text%22%3EKitty%20ipsum%20dolor%20sit%20amet%2C%3Ca%20href%3D%22http%3A%2F%2Ffreecodecamp.com%22%3E%20link%20to%20Free%20Code%20Camp%3C%2Fa%3E%20for%20you%20to%20follow.%20shed%20everywhere%20shed%20everywhere%20stretching%20attack%20your%20ankles%20chase%20the%20red%20dot%2C%20hairball%20run%20catnip%20eat%20the%20grass%20sniff.%3C%2Fp%3E%0A%3Cp%20class%3D%22red-text%22%3EPurr%20jump%20eat%20the%20grass%20rip%20the%20couch%20scratched%20sunbathe%2C%20shed%20everywhere%20rip%20the%20couch%20sleep%20in%20the%20sink%20fluffy%20fur%20catnip%20scratched.%3C%2Fp%3E%0A
need help
Coy Sanders
@coymeetsworld
Jun 07 2016 04:32
I see a dangling tag here @yun-zee Submit>, what was this challenge name?
@kamal231 you only want the text between the anchor tags to be "cat photos". Also you don't want that nested between your p tags
you want to create a new line after your two paragraphs to put the hyperlink
Jo
@yun-zee
Jun 07 2016 04:34
@skilescm whoops, thanks (y)
CamperBot
@camperbot
Jun 07 2016 04:34
yun-zee sends brownie points to @skilescm :sparkles: :thumbsup: :sparkles:
:cookie: 165 | @skilescm |http://www.freecodecamp.com/skilescm
Dylan
@tddaniel114
Jun 07 2016 04:35
@skilescm yeah that's the spot. irritating, isn't it? Wonder what it might take to work the kink out of it?
Alfarhan Zahedi
@alfarhanz
Jun 07 2016 04:36

@kamal231

<p class="red-text">Kitty ipsum dolor sit amet,<a href="http://freecodecamp.com"> link to Free Code Camp</a> for you to follow. shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

<p class="red-text">P

<a href="http://freecodecamp.com"> link to Free Code Camp</a> ...This is how u put it..!!
Coy Sanders
@coymeetsworld
Jun 07 2016 04:37
nope @Alfarhanz
Alfarhan Zahedi
@alfarhanz
Jun 07 2016 04:37
oh yes..
i copied the wrong code
srry
Coy Sanders
@coymeetsworld
Jun 07 2016 04:38
yes, also please don't copy any code either
dont just copy and paste the solutions here, help people work through what they have
Alfarhan Zahedi
@alfarhanz
Jun 07 2016 04:38
i was going to xplain it
srry
my bad
Coy Sanders
@coymeetsworld
Jun 07 2016 04:39
no big deal nothing to be sorry for :)
I gave him suggestions above
jaskohl
@jaskohl
Jun 07 2016 04:40
anyone know if there are any plugins for chrome for the text editor? I often click on the text and it is editing somewhere else.
Coy Sanders
@coymeetsworld
Jun 07 2016 04:42
do you have the webpage full screen @jaskohl, ive noticed FCC doesn't like it except when its full
?
jaskohl
@jaskohl
Jun 07 2016 04:43
i have tried it in full screen and it worked but as soon as I completed the challenge full screen was doing the same thing.
maybe it has to be IE
Coy Sanders
@coymeetsworld
Jun 07 2016 04:43
you were editing the code after you passed tests?
or you mean this happened on next challenge?
jaskohl
@jaskohl
Jun 07 2016 04:43
it happened on the next challenge
Coy Sanders
@coymeetsworld
Jun 07 2016 04:44
hmm I don't know, I use Chrome so its possible it could be IE issue?
though I would imagine thats a big problem and figure a good chunk of people use IE
Ilir Tagani
@CodeHunter24
Jun 07 2016 04:44
yeah i have been using safari, and haven't had a problem yet.
Coy Sanders
@coymeetsworld
Jun 07 2016 04:45
try checking for open issues on GitHub perhaps https://github.com/FreeCodeCamp/FreeCodeCamp/issues/
see if anyone else reported a similar problem using IE
Ilir Tagani
@CodeHunter24
Jun 07 2016 04:45
could just be chrome issue like @coymeetsworld is saying
Coy Sanders
@coymeetsworld
Jun 07 2016 04:45
I'm using Chrome, he's using IE
Ilir Tagani
@CodeHunter24
Jun 07 2016 04:45
opps haha well reverse what i said :)
Coy Sanders
@coymeetsworld
Jun 07 2016 04:45
chrome I have no issues on full screen, but sometimes if I have the page on 1/2 the window things don't work right
Dylan
@tddaniel114
Jun 07 2016 04:45
I figured something out for this
if you can get to the bottom and press enter about 10-15 times
it will give you some extra spacew
makes it work way better
UtkarshShukla7
@UtkarshShukla7
Jun 07 2016 04:46
@tddaniel114 you can also hit backspace and then undo what you deleted and then continue your code
jaskohl
@jaskohl
Jun 07 2016 04:47
@tddaniel114 ill have to try that one
Anton A Avilkin
@Devaste
Jun 07 2016 04:47
Hi there, I have a question about first challenge (tribute one): I there any way to round img caption block?
Coy Sanders
@coymeetsworld
Jun 07 2016 04:49
round the caption how @Devaste?
Anton A Avilkin
@Devaste
Jun 07 2016 04:51
@coymeetsworld https://codepen.io/FreeCodeCamp/details/NNvBQW/ there's an example (can't see source code as for rule#1) of rounded caption around img
Coy Sanders
@coymeetsworld
Jun 07 2016 04:51
im not sure what's round about it
?
also you don't have to necessarily add a caption, you just need to pass user stories just FYI
Trevor
@electrostaticfleece
Jun 07 2016 04:52
@Devaste use the border-radius property
Anton A Avilkin
@Devaste
Jun 07 2016 04:54
@coymeetsworld @electrostaticfleece thx for help, ill check it :)
CamperBot
@camperbot
Jun 07 2016 04:54
devaste sends brownie points to @coymeetsworld and @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:star2: 1074 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:cookie: 357 | @electrostaticfleece |http://www.freecodecamp.com/electrostaticfleece
Coy Sanders
@coymeetsworld
Jun 07 2016 04:54
yeah or use Bootstrap
it looks like thats what its doing
but wasn't sure if you were talking about the image corners being rounded, they are barely rounded but yeah @electrostaticfleece's suggestion would be right and use border-radius
if you wanted to create it with bare CSS
believe one of the earlier challenges had an example on how to do that
Leo Sizaret
@Bungou
Jun 07 2016 04:56
Hello, I'm having trouble with my Navbar D: http://codepen.io/Bungou/pen/dXoJxm?editors=1100 when I remove .nav { color: white; }
the navbar loses its other css properties...why is that?
On top of all, the color: white;
doesn't even do anything. I'm lost X_X
@joeyj
@joeyjurbaz
Jun 07 2016 04:58
Hello world his please help a brother with his first steps in the world of coding I haven't a clue to what I'm doing Thanks
CamperBot
@camperbot
Jun 07 2016 04:58

welcome to FreeCodeCamp @joeyjurbaz!

FM
@mafelix
Jun 07 2016 04:58
@joeyjurbaz welcome to developer hell.
@joeyjurbaz you will not leave this place until you tell me data structures, programming paradigms, what object oriented programming is, sql db, mongodb, what functional programming is, and how to print hello world to console in javascript.
@joeyjurbaz I'm just joking btw. Welcome?
Errol
@eikalina
Jun 07 2016 05:00
Welcome @joeyjurbaz !
Leo Sizaret
@Bungou
Jun 07 2016 05:02
Welcome @joeyjurbaz !
Trevor
@electrostaticfleece
Jun 07 2016 05:02
@Bungou Use your debugger in your browser to take a look at what properties bootstraps CSS is inserting
FM
@mafelix
Jun 07 2016 05:02
oooo
Trevor
@electrostaticfleece
Jun 07 2016 05:02
Also read this article on specificity: https://css-tricks.com/specifics-on-css-specificity/
FM
@mafelix
Jun 07 2016 05:02
very advanced
Leo Sizaret
@Bungou
Jun 07 2016 05:04
@electrostaticfleece Will try, good idea!
Sanchit Dhiman
@sanchit13
Jun 07 2016 05:05
For this code, why is my introduction class not being positioned relative to the backgroundImage class? It's positioned relative to the body.
 <body>
      <div class="container-fluid" id ="backgroundImage">
        <div class="introduction">
          <h1>Hi, my name is Sanchit.</h1>
        </div>
      </div>
  </body>
#backgroundImage{
  background-image: url(https://images.unsplash.com/photo-1454897834822-1ece264a5d89?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=3a5615c0bc77123ece2a2663e2640341);
  background-position:bottom;
  background-size:cover;
  background-repeat: no-repeat;
  height:800px;
  position:relative;
}


.introduction{
  position:absolute;
  top:50%;
  left:25%;
  font-family: Raleway, sans-serif;
  color:white;
}
Anton A Avilkin
@Devaste
Jun 07 2016 05:05
@coymeetsworld checked Bootstrap thumbnails - dat's what i was looking for :)
Coy Sanders
@coymeetsworld
Jun 07 2016 05:10
cool, yeah not bad thing to use
but if you wanted you could create your own thumbnails
Trevor
@electrostaticfleece
Jun 07 2016 05:11
@sanchit13 Your introduction class has it's position specified as absolute, change it to relative and you should be good to go.
@joeyj
@joeyjurbaz
Jun 07 2016 05:13
Hello world
CamperBot
@camperbot
Jun 07 2016 05:13

welcome to FreeCodeCamp @joeyjurbaz!

Sanchit Dhiman
@sanchit13
Jun 07 2016 05:13
  background-image: url(https://images.unsplash.com/photo-1454897834822-1ece264a5d89?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&s=3a5615c0bc77123ece2a2663e2640341);
  background-position:bottom;
  background-size:cover;
  background-repeat: no-repeat;
  height:800px;
  position:relative;
}


.introduction{
  position:relative;
  top:50%;
  left:50%;
  font-family: Raleway, sans-serif;
  color:white;
}
When I do that, this is what happens
Whitespace gets created horizontally after the picture if I do position using relative and set it to 50%
Screen Shot 2016-06-07 at 1.13.53 AM.png
Terry
@Adwoa08
Jun 07 2016 05:15
Hi everyone, I just started learning coding and I feel stuck.
Sanchit Dhiman
@sanchit13
Jun 07 2016 05:15
and it's still relative to the body
@electrostaticfleece
Terry
@Adwoa08
Jun 07 2016 05:17
I wanted to know how to add the a caption to an image. Can anyone help me out? I will really appreciate it!
hnry
@hnry
Jun 07 2016 05:25
@Adwoa08 can you link the challenge you're stuck on?
Terry
@Adwoa08
Jun 07 2016 05:27
Yeah!
Sanchit Dhiman
@sanchit13
Jun 07 2016 05:31
If I do this, the font-size doesn't change, but if I do a in line style change to the h1 tag, it changes, what's the deal?

h1{
  font-size:100px;
}
hnry
@hnry
Jun 07 2016 05:32
@sanchit13 you have something overriding it
or... you just didn't set it up right somewhere
Sanchit Dhiman
@sanchit13
Jun 07 2016 05:33
Make's sense, I was linking 5 other links and a reset, moving the css file as the last link would be the right move I'm guessing @hnry
hnry
@hnry
Jun 07 2016 05:42
@sanchit13 short answer -> yea, but if it is being overwritten, in the future you should avoid that by being more specific
Sanchit Dhiman
@sanchit13
Jun 07 2016 05:43
@hnry check yo pm's
hnry
@hnry
Jun 07 2016 05:43
oh wow, didn't realize i had a few other PMs too lol
Pat
@Beingpat
Jun 07 2016 05:48
Hi can anyone tell me whats wrong with this line.
<p> <a href="http://www.freecatphotoapp.com"> cat photos </a> View more </p>
Create a new p element around your a element.
Your a element should be nested within your new p element.
Your p element should have the text "View more " (with a space after it)
Zach
@Moose1551
Jun 07 2016 05:50
Is there a way to add to a unicode value ? For example. To turn 70 to 83, could you do something along the lines of:
fromCharCode(70 + 13);
Bastian Bay
@bastianbay
Jun 07 2016 05:52
late night coding here, how do i make sure this h1 element is orange?
here is my code so far <h1 class="pink-text blue-text" id=orange-text>
anything in the css i should put? i've already tried '#orange-text { color:brown;
Jacque L.
@kaiallard99
Jun 07 2016 05:53
<h1 style="color:orange">
hnry
@hnry
Jun 07 2016 05:53
@Moose1551 that's it
Leo Sizaret
@Bungou
Jun 07 2016 05:55
How can I prevent the links in the nav to pop out like that? I want them to have a border on hover, but without the popuphttp://codepen.io/Bungou/pen/dXoJxm
Norberto
@nortocode
Jun 07 2016 05:56
@bastianbay <h1 class="pink-text blue-text" id=orange-text> you are missing the " in your id
Pat
@Beingpat
Jun 07 2016 05:57

@Beingpat
Hi can anyone tell me whats wrong with this line.

<p> <a href="http://www.freecatphotoapp.com"> cat photos </a> View more </p>
Create a new p element around your a element.
Your a element should be nested within your new p element.
Your p element should have the text "View more " (with a space after it)

Norberto
@nortocode
Jun 07 2016 06:01
@Beingpat that looks fine
Bastian Bay
@bastianbay
Jun 07 2016 06:01
@nortocode @kaiallard99 thanks you two for the help!
CamperBot
@camperbot
Jun 07 2016 06:01
bastianbay sends brownie points to @nortocode and @kaiallard99 :sparkles: :thumbsup: :sparkles:
:cookie: 214 | @nortocode |http://www.freecodecamp.com/nortocode
:cookie: 136 | @kaiallard99 |http://www.freecodecamp.com/kaiallard99
Pat
@Beingpat
Jun 07 2016 06:02
@nortocode then why its not working ?
Jacque L.
@kaiallard99
Jun 07 2016 06:02
  1. View more should be before your <a> element if you want the sentence to read View more cat photos
Norberto
@nortocode
Jun 07 2016 06:02
@Beingpat something to do with some minor detail I guess
Jacque L.
@kaiallard99
Jun 07 2016 06:03
and if i'm not mistaken, its not working b/c the actual link shouldn't have the www. if it's the same challenge i'm thinking of
Norberto
@nortocode
Jun 07 2016 06:03
@kaiallard99 that if view more is the anchor for example
Pat
@Beingpat
Jun 07 2016 06:04
@nortocode right its not anchor it should be simple text
@kaiallard99 no the link has www.
Norberto
@nortocode
Jun 07 2016 06:06
@Beingpat swap things like @kaiallard99 said, View more with cat photos
Rube
@rubenlomakin
Jun 07 2016 06:07
Hey I need help with "Target the element with the id target3 and use the jQuery addClass() function to give it the class fadeOut." Can someone help me
Pat
@Beingpat
Jun 07 2016 06:07
@nortocode already tried thats not working.
Norberto
@nortocode
Jun 07 2016 06:07
@rubenlomakin $('#theidtotarget')
Rube
@rubenlomakin
Jun 07 2016 06:08
@nortocode Where do I add it to
Norberto
@nortocode
Jun 07 2016 06:08
@Beingpat what's the name of the of the challenge ?
Jacque L.
@kaiallard99
Jun 07 2016 06:08
<p>View more<a href="http://www.freecatphotoapp.com">cat photos</a></p>
if that doesn't work, try refreshing the page then using that
Norberto
@nortocode
Jun 07 2016 06:09
@rubenlomakin $('#theidtotarget').addClass('the class you want') , in <script>
Rube
@rubenlomakin
Jun 07 2016 06:10
Okay, so I must add it to the script section, right?
Norberto
@nortocode
Jun 07 2016 06:10
yes
Jacque L.
@kaiallard99
Jun 07 2016 06:10
@Beingpat <p>View more<a href="http://www.freecatphotoapp.com">cat photos</a></p>
Pat
@Beingpat
Jun 07 2016 06:10
@nortocode catphotoapp
@kaiallard99 Its not working ..
Jacque L.
@kaiallard99
Jun 07 2016 06:11
@Beingpat actually the name of that challenge is Nest an Anchor Element within a Paragraph
you tried refreshing the page first?
b/c i just used that exact code and it worked
excuse me, add the space after more, then it should work
<p>View more <a href="http://www.freecatphotoapp.com">cat photos</a></p>
Norberto
@nortocode
Jun 07 2016 06:13
yes that whould work
Pat
@Beingpat
Jun 07 2016 06:13
@kaiallard99 Thnx finally..
CamperBot
@camperbot
Jun 07 2016 06:13
beingpat sends brownie points to @kaiallard99 :sparkles: :thumbsup: :sparkles:
:cookie: 137 | @kaiallard99 |http://www.freecodecamp.com/kaiallard99
Norberto
@nortocode
Jun 07 2016 06:13
should
Jacque L.
@kaiallard99
Jun 07 2016 06:15
can anyone here help with the <nav> tag?
Broozius
@Brucius
Jun 07 2016 06:15
What do you need help with @kaiallard99
Jacque L.
@kaiallard99
Jun 07 2016 06:16
my portfolio project, just wondering the easiest way to make the button navigate to the section i want
Robert Ndlovu
@wozatel
Jun 07 2016 06:16
hello good people i dont undersatnd this its not clear To get started, we should nest all of our HTML in a div element with the class container-fluid
Jacque L.
@kaiallard99
Jun 07 2016 06:17
if i ID the <div> can i target it by the ID in the <nav> command to jump to that section?
Robert Ndlovu
@wozatel
Jun 07 2016 06:17
<nav class="container-fluid"> ,y questio where do i put it ?
Just started on Bootstrap Fluid Containers
no luck chau
Jacque L.
@kaiallard99
Jun 07 2016 06:19
it would be <div class="container-fluid> not <nav
and it would go at the beggining of the body of the page..
JJ
@Hopper-G
Jun 07 2016 06:19
Hi all, so I think I'm being a bit dim, but where's the best place to store text i want to put in a div created by a click event? Should I store it in variables in jquery and then use a series of if's (does jquery have a switch/case type feature?) to add the content specific to the button clicked, Or should I be writing it in html and adding it with jquery using the id of the relevant html object? As someone who's only done a bit of python before, I'm thinking the variables, but I'm looking for any best practice tips? Basically the idea is there's three buttons, you click any and a div appears below, but the text in the div depends upon the button clicked.
Jacque L.
@kaiallard99
Jun 07 2016 06:21
@wozatel you got that?
@wozatel <div class=container-fluid> would go after your CSS (</style>) and </div> would go at the very end
Sorin Ruse
@sorinr
Jun 07 2016 06:24
@Hopper-G yes jq has switch/case
Shraddha Parab
@Shraddha99
Jun 07 2016 06:27
while making the same cat app on laptop . I used md(medium) instead of xs . still it doesn't fit in properly and doesnt looks good on laptop screen . the image is way to big than the title of Catphotoapp . in that case should I use html to make image dimensions smaller or is there any bootstrap tag that can do so?
hnry
@hnry
Jun 07 2016 06:30
@Shraddha99 did you set .img-responsive on the <img> ?
that is give it the img-responsive class
Thieu van Dijk
@Thieuvandijk
Jun 07 2016 06:31
Good morning!
Doug
@dburwell
Jun 07 2016 06:31
wassup.. I'm trying to give this div element a background color and I'm stuck
JJ
@Hopper-G
Jun 07 2016 06:34
Thanks @sorinr :) I just looked up the syntax for a switch/case and am thinking this is the best way to assign the text:
      var text_out = "";
      var text_in = $(this).attr("id");
      switch (text_in){
        case "button_1":
          text_out = "Text for button 1";
        case "button_2":
          text_out = "Text for button 2";
        case "button 3":
          text_out = "text for button 3";
        defualt:
          text_out = "Content not found.";
      }
CamperBot
@camperbot
Jun 07 2016 06:34
hopper-g sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Jun 07 2016 06:36
@Hopper-G you can also add break; after each case text_out match
Darth Skywalker
@adityaparab
Jun 07 2016 06:37
@Hopper-G : If you don't put a break; after each case, your text_out will always be "Content not found."
hnry
@hnry
Jun 07 2016 06:38
@Hopper-G alternatively, you can store the text on the button itself
JJ
@Hopper-G
Jun 07 2016 06:40
Thanks All! I was just adding it in that would have been annoying! I thought it was odd there was no break, the JS example had breaks, but the jquery one didnt and as I've not done JS yet, I thought I'd just follow the JQ example lol
*Thanks @adityaparab @hnry @sorinr (aparently the bot didn't understand my "all" ;)
CamperBot
@camperbot
Jun 07 2016 06:41
hopper-g sends brownie points to @adityaparab and @hnry and @sorinr :sparkles: :thumbsup: :sparkles:
:warning: hopper-g already gave sorinr points
:cookie: 274 | @hnry |http://www.freecodecamp.com/hnry
:cookie: 282 | @adityaparab |http://www.freecodecamp.com/adityaparab
JJ
@Hopper-G
Jun 07 2016 06:41
@hnry store it as an attribute? like alt for images?
Sorin Ruse
@sorinr
Jun 07 2016 06:41
@adityaparab yep. if u need that default its a must
hnry
@hnry
Jun 07 2016 06:42
@Hopper-G yea
Leo Sizaret
@Bungou
Jun 07 2016 06:44
Does anyone know how I can get rid of the "popup effect" when hovering over the links in the navigation bar? I'd like the borders to display on hover, but not have that popup effect. http://codepen.io/Bungou/full/dXoJxm/
Shraddha Parab
@Shraddha99
Jun 07 2016 06:45
@hnry Yes I have used "img-responsive". <div class="col-md-4"><a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a></div>
JJ
@Hopper-G
Jun 07 2016 06:48
Awesome, glad I learnt something new :D
I am realising though that if I put it on the button, it does look less attractive, but it is more efficient as it doesn't have to do a case fall through each time a button is clicked
Jacque L.
@kaiallard99
Jun 07 2016 06:48
@dburwell <div style="background-color: coloryouwant:>
hnry
@hnry
Jun 07 2016 06:49
@Shraddha99 that should work, http://jsbin.com/koyejaqomo/edit?html,js,output as you can see, you move the output window, the image scales accordingly
Shraddha Parab
@Shraddha99
Jun 07 2016 06:49
when I tried to nest the radio buttons they worked in free code camp but when I tried on my pc . they are coming like this
JJ
@Hopper-G
Jun 07 2016 06:50
Excellent, thanks @hnry :)
CamperBot
@camperbot
Jun 07 2016 06:50
hopper-g sends brownie points to @hnry :sparkles: :thumbsup: :sparkles:
:warning: hopper-g already gave hnry points
Sorin Ruse
@sorinr
Jun 07 2016 06:51
@Bungou yourclass/element:hover{padding-top: -the value of your border} to make the text stay in place
Leo Sizaret
@Bungou
Jun 07 2016 06:54
@sorinr That doesn't work
Shraddha Parab
@Shraddha99
Jun 07 2016 06:55
@hnry thanks . I copied the code from free code camp to notepad++ it worked I might have made some mistake earlier
CamperBot
@camperbot
Jun 07 2016 06:55
shraddha99 sends brownie points to @hnry :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @hnry |http://www.freecodecamp.com/hnry
Leo Sizaret
@Bungou
Jun 07 2016 06:55
@sorinr My bad! It does...I also have to change other paddings though
Sorin Ruse
@sorinr
Jun 07 2016 06:56
@Bungou add a class and apply it to only where you need it
taka93shi
@taka93shi
Jun 07 2016 06:58
hi
Sorin Ruse
@sorinr
Jun 07 2016 07:01
@Bungou you have to take care also of the padding-left and padding-right for the first and last li element the same way. Hope u get what I mean?
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 07:01
```js
Trevor
@electrostaticfleece
Jun 07 2016 07:02
@Bungou, might have an implementation that get's you close that's js free, but you might have to play around a bit to get it perfect
Dylan
@tddaniel114
Jun 07 2016 07:02
Has anyone gotten to the bootstrap section of the html/css course yet?
Leo Sizaret
@Bungou
Jun 07 2016 07:02
@sorinr Trying!
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 07:03

<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%;
  }
  .fa {}
  .fa-info-cicle {}
  .fa-thumbs-up {}
  .col {}
</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">Like</button>
    </div>
    <div class="col-xs-4">
      <button class="btn btn-block btn-info">Info</button>
    </div>
    <div class="col-xs-4">
      <button class="btn btn-block btn-danger">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>
<button type="like"> Like
        <i class="fa fa-info-circle fa-thumbs-up"></i></button>
whats wrong? im stuck :(
"Your fa-thumbs-up icon should be located within the Like button."
Dylan
@tddaniel114
Jun 07 2016 07:03
it asked me to next all of the HTML in a div with a class called 'container-fluid' and I'm having a tough time figuring out what that means, exactly
Trevor
@electrostaticfleece
Jun 07 2016 07:04
@Bungou for contactMe ID on hover set top: -5px, left -5px, margin-right: -5px. For portfolio ID on hover set top to -5px and for hello ID on hover set top to -5px
Dylan
@tddaniel114
Jun 07 2016 07:05
haha oddly that got it for me :P
@irurrahman
Ikhwan Khairurrahman
@irurrahman
Jun 07 2016 07:06
@tddaniel114 was my code solve your problem? lel
Trevor
@electrostaticfleece
Jun 07 2016 07:06
@Bungou then set padding bottom & hello ID on hover for both to 13px; and it should be very close...
Shawn
@maple3011
Jun 07 2016 07:09
<a rseat="hello" href="http://yule.iqiyi.com" > , hello guys, do you know what is the meaning of rseat as shown in the bracket.
Leo Sizaret
@Bungou
Jun 07 2016 07:10
.nav>li>#contactMe:hover { background-color: transparent; border-top: 5px solid white; border-left: 5px solid white; margin-right: -5px; padding-top: 5px; padding-left: -5px; padding-bottom: 13px; }
Yes, almost there :D It nudges to the right still, but the rest works out
Sorin Ruse
@sorinr
Jun 07 2016 07:10
@Bungou when u hover you are adding a 5px border so you should move your text by -5px to stay in place
Leo Sizaret
@Bungou
Jun 07 2016 07:12
@sorinr Makes sense...I thought the border was there to begin with, and that all I did by hovering was make it appear larger and white.
@electrostaticfleece Thanks :)
CamperBot
@camperbot
Jun 07 2016 07:12
bungou sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:cookie: 360 | @electrostaticfleece |http://www.freecodecamp.com/electrostaticfleece
Leo Sizaret
@Bungou
Jun 07 2016 07:13
I imagine this would be easier in JS?
Trevor
@electrostaticfleece
Jun 07 2016 07:15
Yes and no. It's still the same problem. JS just allows you to automate and change inputs if they are variables. It could be solved in JS, but I actually think the CSS implementation is easier IMO.
Sorin Ruse
@sorinr
Jun 07 2016 07:15
@Bungou its a pure css problem. why complicate to fix it in js?
SomeNeverLearn
@SomeNeverLearn
Jun 07 2016 07:16
How do you create a class called "Smaller-image"?
Trevor
@electrostaticfleece
Jun 07 2016 07:16
Really good tutorial on CSS positioning/layout/boxmodel if you're interested: http://learnlayout.com/index.html
SomeNeverLearn
@SomeNeverLearn
Jun 07 2016 07:18
How do you size a img by assigning it a css class called smaller-image?
Trevor
@electrostaticfleece
Jun 07 2016 07:19
Inline: <img class="Smaller-image">
Sorin Ruse
@sorinr
Jun 07 2016 07:19
@SomeNeverLearn .smaller-image{ width: xxx;, height: auto;}
Leo Sizaret
@Bungou
Jun 07 2016 07:19
@electrostaticfleece ty...I have the feeling this is becoming an uncomfortable storm of problems, where I keep adding and removing stuff but not knowing what anything does anymore :(
CamperBot
@camperbot
Jun 07 2016 07:19
bungou sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:warning: bungou already gave electrostaticfleece points
SomeNeverLearn
@SomeNeverLearn
Jun 07 2016 07:22
@sorinr then how do i assign it in text for the img
@sorinr
Sorin Ruse
@sorinr
Jun 07 2016 07:24
@SomeNeverLearn as @electrostaticfleece told you <img class="smaller-image">
Trevor
@electrostaticfleece
Jun 07 2016 07:26
@Bungou I think you just summed up what my life is like in one perfect sentence, haha.
Leo Sizaret
@Bungou
Jun 07 2016 07:27
Hahaha :D
@electrostaticfleece Finally got it to work. Do you have any idea how to make it responsive? I've positioned the tab using display: absoluteand playing with pixels -> when I size the window down the thing breaks down :P
I did nest them into rows and bootstrap columns
But the whole thing feels very "put together with scotch tape"
Trevor
@electrostaticfleece
Jun 07 2016 07:33
It would probably take me too long to explain. Look up the Bootstrap documentation under grid system and then look into media queries if that doesn't get you all of the way, http://getbootstrap.com/css/
Sorin Ruse
@sorinr
Jun 07 2016 07:34
@Bungou why do u have an empty div col-md-6? and not using col-md-6 col-md-offset-x? and you change x accordingly to ur needs
Le Twitch
@notalkingplz
Jun 07 2016 07:38

http://codepen.io/letwitch/pen/VjvPQw?editors=1100

Because the img has flex-shrink: 0; on it, when the browser width gets smaller, the text on the right gets pushed out of it's container. Any way to fix?

Leo Sizaret
@Bungou
Jun 07 2016 07:41
@electrostaticfleece Will do, thanks
CamperBot
@camperbot
Jun 07 2016 07:41
bungou sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:warning: bungou already gave electrostaticfleece points
Trevor
@electrostaticfleece
Jun 07 2016 07:41
@notalkingplz Do you plan on having that container filled with one long word? If you break it up into multiple words you should see that it fits just fine. Depending on how much text you have, you might not even have to do anything.
Sorin Ruse
@sorinr
Jun 07 2016 07:41
@notalkingplz where is your flex-direction: ?
Le Twitch
@notalkingplz
Jun 07 2016 07:47
@electrostaticfleece The text is exaggerated, but if it does get too long, I want text-overflow: ellipsis; to solve that problem
@sorinr If you're talking about the navy blue container, the default flex-direction is row, which is exactly what I need it to do
Trevor
@electrostaticfleece
Jun 07 2016 07:53
@notalkingplz Well in that case you need to give your container a width property or a max-width property. And apply the whitespace, width, overflow, and text-overflow properties to your text
Sorin Ruse
@sorinr
Jun 07 2016 07:53
@notalkingplz maybe instead of @media (min-width: 400px) you meant @media (max-width: 399px)
fernando
@zaynsantiago
Jun 07 2016 07:59
hey everyone i need help so i was suppose to make an h1 with hello world and make the background green and make the family font mono space and i didnt work what am i doing wrong heres me code
<style>
body {
background-color:green
}
<h1> Hello World </h1>
font-family:Monospace;
</style>
Ankit Panwar
@coderNoob
Jun 07 2016 08:04
@zaynsantiago Your style syntax is wrong. It is supposed to be h1 { font-family: monospace; }
Robert Uivarosi
@URobert
Jun 07 2016 08:05
@zaynsantiago these <h1> Hello World </h1> are html tags, and they have now place within the <style> tags.
@zaynsantiago Above @coderNoob Gave you the right syntax that allows you to modify h1 element style in CSS
Ankit Panwar
@coderNoob
Jun 07 2016 08:08
@URobert I didn't get you. Are you saying you can place the html tags in CSS like @zaynsantiago has done in this case?
Gregory Orton
@ortonomy
Jun 07 2016 08:09
hi all. Any maths junkies in here
having trouble with smallest common multiple
Robert Uivarosi
@URobert
Jun 07 2016 08:09
@coderNoob OMG. I'm clearly seriously tired... I messed up some words in there. What I wanted to say is that : html tags like <h1> </h1> have no place withing CSS :0
Trevor
@electrostaticfleece
Jun 07 2016 08:09
@geligelu No, we're just all meth junkies in here.
Gregory Orton
@ortonomy
Jun 07 2016 08:10
cool. same difference
Robert Uivarosi
@URobert
Jun 07 2016 08:10
within*
@geligelu :)
What's the problem ?
Broozius
@Brucius
Jun 07 2016 08:10
@zaynsantiago i don't think your <h1> tag should be within the style tag
Gregory Orton
@ortonomy
Jun 07 2016 08:10
may have just solved it
:)
but still want feedback
So here's my solution for smallest common multiple:
fernando
@zaynsantiago
Jun 07 2016 08:11
@URobert yeah whenever i put my <h1> tags within the style tag it wont appear so thats why i took them out
Broozius
@Brucius
Jun 07 2016 08:11
<style>
h1 {
background-color:green;
}
font-family:Monospace;
</style>
oops sorry
Gregory Orton
@ortonomy
Jun 07 2016 08:11
 function gcd(...numbers) {
      return numbers.reduce((a, b) => b === 0 ? a : gcd(b, a % b));
  }


  function lcm(numbers) {
      return numbers.reduce((a,b) => a * b / gcd(a,b) );
   }
Broozius
@Brucius
Jun 07 2016 08:12

<style>
h1 {
background-color:green;
font family:Monospace;
}
</style>

<h1> header </h1>

Gregory Orton
@ortonomy
Jun 07 2016 08:12
the variable numbers is an array
Broozius
@Brucius
Jun 07 2016 08:12
@geligelu hi greg could you tell me how to do that black box?
Gregory Orton
@ortonomy
Jun 07 2016 08:12
@OakerMin use github markdown
```` (four of these)
then your code
```` (then four more)
Broozius
@Brucius
Jun 07 2016 08:13
ahh ok! thank you @geligelu
CamperBot
@camperbot
Jun 07 2016 08:13
oakermin sends brownie points to @geligelu :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @geligelu |http://www.freecodecamp.com/geligelu
Gregory Orton
@ortonomy
Jun 07 2016 08:13
@OakerMin no worries
Anyway I need help @URobert -
here's my full solution for the challenge @ https://www.freecodecamp.com/challenges/smallest-common-multiple
function smallestCommons(arr) {

  arr = arr.sort( function ( a , b ) {
    return a - b;
  });

  var sortedArr = [];
  for ( var i = arr[0]; i <= arr[1] ; i++) {
    sortedArr.push(i);
  }
  console.log(sortedArr);

  function gcd(...numbers) {
      return numbers.reduce((a, b) => b === 0 ? a : gcd(b, a % b));
  }


  function lcm(numbers) {
      return numbers.reduce((a,b) => a * b / gcd(a,b) );
   }

return lcm(sortedArr);

}
and it works
but but but
but I originally tried with the spread operator on 'numbers' in the call to lcm
i.e.
function lcm (...numbers) {
...
}
but it didn't work
I thought you weren't allowed to pass an array as an argument in a JS function
but obviously I can...
?
any ideas
Trevor
@electrostaticfleece
Jun 07 2016 08:21
Yeah, passing arrays is perfectly legal and really quite necessary in JS. This is actually pretty close to most of the implementations that I've seen for LCM good job
Gregory Orton
@ortonomy
Jun 07 2016 08:21
@electrostaticfleece - thanks.
CamperBot
@camperbot
Jun 07 2016 08:21
geligelu sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @electrostaticfleece |http://www.freecodecamp.com/electrostaticfleece
Gregory Orton
@ortonomy
Jun 07 2016 08:22
@electrostaticfleece - BUT... and big BUT
@electrostaticfleece - I thought you had to pass arrays with
Array.prototype.apply(this,function ( element, index, ...) { ... });
Trevor
@electrostaticfleece
Jun 07 2016 08:23
Nope. When it comes down to it an array is really just a special type of object and can be passed around. In fact , everything in Javascript is an object in one sense or another
You can even pass functions...
Gregory Orton
@ortonomy
Jun 07 2016 08:24
Right, OK
So, then why do we have 'apply' @electrostaticfleece ?
Is it only when you need to pass the content of an array as each argument?

Like

someFunction( a , b, c, d) { ... }

but you have your arguments in

[a,b,c,d]
?
Trevor
@electrostaticfleece
Jun 07 2016 08:25
That's my understanding of its use
Gregory Orton
@ortonomy
Jun 07 2016 08:25
Nice. getting closer to a working knowledge!
julia
@juliaBubnova
Jun 07 2016 08:28
Hello!I need your help!I can't change the size of my image(

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

Trevor
@electrostaticfleece
Jun 07 2016 08:28
The Definitive Guide to Javascript has a really nice section on call and apply. I think it should be online for free as a pdf. It also goes over some good OOP examples that implement in various contexts if I recall correctly.
Gregory Orton
@ortonomy
Jun 07 2016 08:28
@electrostaticfleece - sweet, I'll look for it
@electrostaticfleece - thanks again
CamperBot
@camperbot
Jun 07 2016 08:28
geligelu sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:warning: geligelu already gave electrostaticfleece points
KirbStarRulz
@KirbStarRulz
Jun 07 2016 08:29
@juliaBubnova the image in class .smaller-image?
@juliaBubnova maybe try set a height element, height: auto;
julia
@juliaBubnova
Jun 07 2016 08:31
not working again(
KirbStarRulz
@KirbStarRulz
Jun 07 2016 08:32
@juliaBubnova if you want it smaller, change the width: 100; to a smaller value
APURV SINGH
@apurvvv
Jun 07 2016 08:33
@juliaBubnova can u tell the challenge number?
Coy Sanders
@coymeetsworld
Jun 07 2016 08:33
@juliaBubnova you need to assign the smaller image class to your img tag
the rest of the code looks fine
Trevor
@electrostaticfleece
Jun 07 2016 08:34
@juliaBubnova You need to apply your smaller-image class to your image tag. so <img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat">
julia
@juliaBubnova
Jun 07 2016 08:36
thanks a lot!!!it's working!!!
Coy Sanders
@coymeetsworld
Jun 07 2016 08:36
no problem
Saul Good
@hyperd4313
Jun 07 2016 08:38
I need help. Im on Remove an Elment using JQuery. I dont know what im doing.
What do I need in the .remove function?
$("target4").remove();
Broozius
@Brucius
Jun 07 2016 08:40
@hyperd4313 do you have other components to that code?
Coy Sanders
@coymeetsworld
Jun 07 2016 08:40
you need to specify the id target4 @hyperd4313
not just "target4"
Saul Good
@hyperd4313
Jun 07 2016 08:40
forgot the #
Coy Sanders
@coymeetsworld
Jun 07 2016 08:40
yup
Saul Good
@hyperd4313
Jun 07 2016 08:40
sorry kind of sleepy but cant sleep.
thanks coy
Coy Sanders
@coymeetsworld
Jun 07 2016 08:41
no problem yeah right there with you
trying to read but I'm not getting anywhere
Saul Good
@hyperd4313
Jun 07 2016 08:42
Have a question for you coy. I just started. How long did it take for this to feel natural for you?
Coy Sanders
@coymeetsworld
Jun 07 2016 08:43
It's really different for everyone
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 08:43
Good morning all
Coy Sanders
@coymeetsworld
Jun 07 2016 08:43
some people pick things up quick and some can be a little slower
key is to try and be consistent especially when starting out, try to do a little bit each day
Saul Good
@hyperd4313
Jun 07 2016 08:44
im the latter def.
Coy Sanders
@coymeetsworld
Jun 07 2016 08:44
that's ok, but try to do some of the challenges or ziplines everyday, even if you don't finish one challenge try to keep working through it. Some of them get tougher as it goes on especially JavaScript portions
if you take too long of a break you may forget what you were working on before and then you feel like you didn't learn anything
Mar10-9us
@Mar10-9us
Jun 07 2016 08:45
http://codepen.io/mar109us/full/wWKGpw/ Does someone have any ideas on how to continue? I lack ideas:P
Coy Sanders
@coymeetsworld
Jun 07 2016 08:45
thats happened to me before
APURV SINGH
@apurvvv
Jun 07 2016 08:47
i didn't understand the question of word blanks. I have never seen a mad lib
Coy Sanders
@coymeetsworld
Jun 07 2016 08:49
@apurvvv you're basically concatenating all the parameters passed into wordBlanks into one string and assigning it to result
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 08:49
That looks really nice Mar
Colin
@breakpoint1025
Jun 07 2016 08:50
Do not add a class attribute to the second p element.

<style>

.red-text {
color: red;
}

p
{
font-size: 16px;
}

</style>

<h2 class="red-text">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>

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

I already removed the class attribute for the second p element.
Why I got such error?
Coy Sanders
@coymeetsworld
Jun 07 2016 08:51
you didn't add it to the first
the first p tag should have red-text class assigned right?
Colin
@breakpoint1025
Jun 07 2016 08:52
No I attached the source code above
Coy Sanders
@coymeetsworld
Jun 07 2016 08:52
I'm saying thats what you need to add, I think. What's the challenge name again?
Colin
@breakpoint1025
Jun 07 2016 08:53
Change the Font Size of an Element
The challenge name.
Let me check.
Coy Sanders
@coymeetsworld
Jun 07 2016 08:54
think you wanted to keep that class there
Colin
@breakpoint1025
Jun 07 2016 08:54
It works after first p tag should have red-text class assigned.
Coy Sanders
@coymeetsworld
Jun 07 2016 08:55
yes you don't modify that
Colin
@breakpoint1025
Jun 07 2016 08:55
Thanks a lot~ @coymeetsworld
CamperBot
@camperbot
Jun 07 2016 08:55
breakpoint1025 sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1080 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
Jun 07 2016 08:55
the reason is it wants to make sure you're using the p tag to give font-size 16px
not put it inside red-text
i think
np
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 08:56
there's no class on the first P like Cory said, try this:
on the first <p> use the following:
<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>
Shraddha Parab
@Shraddha99
Jun 07 2016 08:57
what exactly we are supposed to do? in here ; Give your left well the id of left-well.
Give your right well the id of right-well.
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 08:58
well or wall?
Shraddha Parab
@Shraddha99
Jun 07 2016 08:59
@GenghisJohn2016 never-mind I got it
Colin
@breakpoint1025
Jun 07 2016 09:00
Thank you all. It works after I put class="red-text" to first p.
Mar10-9us
@Mar10-9us
Jun 07 2016 09:00
@GenghisJohn2016 Thanks, but i don't know what to add next. haha
CamperBot
@camperbot
Jun 07 2016 09:00
mar10-9us sends brownie points to @genghisjohn2016 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for genghisjohn2016
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:02
@Mar10-9us, are you just free styling it? if so, why not make it have some info there, maybe some pictures, a Q&A game using radials and texts?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:03
@GenghisJohn2016 Its supposed to be for the portfolio challenge. I just don't know where i should place stuff etc. the outcome will become ugly :(
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:03
oh oh, sorry, I haven't gotten quite that far yet :(
Mar10-9us
@Mar10-9us
Jun 07 2016 09:05
@GenghisJohn2016 No problem! are you at the tribute challenge?
nira
@Niraly
Jun 07 2016 09:05
does anyone know more about the .smaller-image {
width: 100px;
} code?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:05
@Niraly know more about? I don't know what you mean, sorry
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:05
@Mar10-9us goodness, no sir, I'm at the very beginning still lol my current challenge is "override all other styles", I haven't coded in ages and ages, relearning seems to take just as long as learning it the first time lol
nira, I might be able to help, could you tell me what you're trying to get it to do and show me your code?
nira
@Niraly
Jun 07 2016 09:06
a min plz
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:06
take your time madam, no rush
Mar10-9us
@Mar10-9us
Jun 07 2016 09:06
@GenghisJohn2016 I see :)
nira
@Niraly
Jun 07 2016 09:06

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

this is what i got i just need to make the image smaller
and tryed all kinds of things
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:07
in the challenge section, where it has the red X and green checks, what does that tell you about the size?
nira
@Niraly
Jun 07 2016 09:07
Your img element should have the class smaller-image.
Your image should be 100 pixels wide. Browser zoom should be at 100%.
thats all in check as far as i saw
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:08
lemme take a look :)
your image element doesn't seem to have a class yet, try this:
<img class="smaller-image src ="https://bit.ly/fcc-relaxing-cat">
nira
@Niraly
Jun 07 2016 09:10
(its my first ever day of coding sorry for being such a noob) (A)
thanks
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:10
no worries at all, we all have to start somewhere :)
nira
@Niraly
Jun 07 2016 09:10
true story
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:10
a bit of something that helped me understand if I may?
nira
@Niraly
Jun 07 2016 09:11
sure
oh btw thanks it worked
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:11
When you put the .smaller image in the style, the ".smaller-image" means you're telling your code "ok, everything that says class="smaller-image" will be the size I just told you, 100px" so you did the first half perfectly, you just forgot to say "hey, change THIS to smaller-image" by adding the class="smaller-image" to it
yvw, happy to help where I can
Yaroslav
@YVeselovskyi
Jun 07 2016 09:12
Does IE 11 support getElementsByName?
nira
@Niraly
Jun 07 2016 09:12
ahhh okay now i uderstand
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:12
in the style ".smaller-image" could just say ".tiny" or ".little" or ".pleasedontelectdonaldtrump" and it'd do the same thing
nira
@Niraly
Jun 07 2016 09:12
xDDD
dilawarshahzad7778
@dilawarx
Jun 07 2016 09:13
"View more cat photos", but where only "cat photos" is a link, and the rest of the text is plain text.
?
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:13
dila, which challenge are you on? what is the name of it on the top left?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:13
<p>view more<a href="#">cat photos</a></p> ??
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:14
oooo good memory Mar
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:14
hi... Can anyone help me out with the Create a Form Element challenge
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:15
I will give it a try saifee :)
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:15
I am unable to understand how to nest
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:15
can you first tell me what the challenge wants you to do, and then show me your code please?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:15
I don't know if its right, though. he/she will have to test it. also the link is broken, she will haev to add her own url.
Its a he
LOL
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:15
I think you're absolutely right Mar
Mar10-9us
@Mar10-9us
Jun 07 2016 09:16
How do i talk about a person without using "he/she"
Ah. i could use their name.
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:16
you could use "they" I suppose or their name
....why am I craving cold pizza....
I do it the old school way, I use either he or she until they yell at me lol
Mar10-9us
@Mar10-9us
Jun 07 2016 09:17
@GenghisJohn2016 i didnt have a problem with this until you called nira "mylady"
:p you ruined me!
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:18
rofl
tips fedora
@saifeemustafaq are you still with us?
dilawarshahzad7778
@dilawarx
Jun 07 2016 09:18
its says the "view more " should be text after a space? of the linked text?
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:19
@dilawarx can you show us your code?
dilawarshahzad7778
@dilawarx
Jun 07 2016 09:19
help!
CamperBot
@camperbot
Jun 07 2016 09:19

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

GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:19
thanks @Mar10-9us
CamperBot
@camperbot
Jun 07 2016 09:19
genghisjohn2016 sends brownie points to @mar10-9us :sparkles: :thumbsup: :sparkles:
:cookie: 124 | @mar10-9us |http://www.freecodecamp.com/mar10-9us
dilawarshahzad7778
@dilawarx
Jun 07 2016 09:21
<P> view more <a href="http://www.freecatphotoapp.com">cat photos</a>
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:22
@dilawarx for me to better help you, if I may, could you post your entire code and tell me exactly what you're trying to do?
dilawarshahzad7778
@dilawarx
Jun 07 2016 09:22
this the text "view more" must come after it??
Mar10-9us
@Mar10-9us
Jun 07 2016 09:23
<p> view more <a href="http://www.freecatphotoapp.com">cat photos</a></p>
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:23
are they doing "view more cat photos" but 'cat photos' has the link?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:28
@GenghisJohn2016 What did you thank me for ?:P
CamperBot
@camperbot
Jun 07 2016 09:28
mar10-9us sends brownie points to @genghisjohn2016 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for genghisjohn2016
Praveen Saraogi
@saraogipraveen
Jun 07 2016 09:28
can anybody brief me about jquery ? and what is the difference between javascript and jquery?
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:32
sorry i am back

Create a Form Element
You can build web forms that actually submit data to a server using nothing more than pure HTML. You can do this by specifying an action on your form element.

For example:

<form action="/url-where-you-want-to-submit-form-data"></form>

Nest your text field in a form element. Add the action="/submit-cat-photo" attribute to this form element.

this is what the challenge is
and this is what i did :

<p>Things cats love:</p>

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

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

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

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

<form action="/submit-cat-photo"></form>

Mar10-9us
@Mar10-9us
Jun 07 2016 09:33
You have not nested it in the form element.
Nesting is putting an elemnt inside another
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:34
so where should i put the form element inside of? @Mar10-9us
Mar10-9us
@Mar10-9us
Jun 07 2016 09:34
The opening tag : "<form action="/submit-cat-photo">" should be at the top, and "</form>" should be at the bottom
<form action="/submit-cat-photo"><input type="text" placeholder="cat photo URL"></form>
Now the text is nested within the form element
Ojo Oluwasetemi
@Oluwasetemi
Jun 07 2016 09:35
Target the same element with multiple jQuery Selectors
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:35
that's why I thanked you, you're a helper Mar
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:35
oh... let me try
Ojo Oluwasetemi
@Oluwasetemi
Jun 07 2016 09:35
I have problem with this section in the jQuery
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:36
I'm of no help there Ojo, I'm not that far yet :(
Ojo Oluwasetemi
@Oluwasetemi
Jun 07 2016 09:36
the question is > Only add one class with each of your three selectors.
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:37
@Mar10-9us thanks
CamperBot
@camperbot
Jun 07 2016 09:37
saifeemustafaq sends brownie points to @mar10-9us :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @mar10-9us |http://www.freecodecamp.com/mar10-9us
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:38
btw I dont get the difference between the form and input... if i wanted to make multiple input slots than i would type input multiple times and it would give the same result.. so why enclose it in the form element
Mar10-9us
@Mar10-9us
Jun 07 2016 09:39
@saifeemustafaq everything inside "form" is what you're sending to the server
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:40
and what about all those outside the form? would they be just a dummy box
Mar10-9us
@Mar10-9us
Jun 07 2016 09:40
@saifeemustafaq I think so, yes :-)
saifeemustafaq
@saifeemustafaq
Jun 07 2016 09:41
and what exactly is this "/submit-cat-photo" it doesnt seem to be a link or a class or anything
Ojo Oluwasetemi
@Oluwasetemi
Jun 07 2016 09:41
It is this \n >Target the same element with multiple jQuery Selectors
Carlos Gomez
@Indalobit
Jun 07 2016 09:42
lol I am stuck just started jajaj
Mar10-9us
@Mar10-9us
Jun 07 2016 09:42
@saifeemustafaq Thats where the information in your form get sent
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:42
that's why we're here Mr. Gomez! I'll try to help you if I can, what are you stuck on?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:43
@saifeemustafaq Don't they explain this in the challenge?
Murat Doğan
@fion95
Jun 07 2016 09:43
 <p>Click here for <a href="#">cat photos</a>.</p>
why doesn't it work?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:43
Whats the challenge ? @fion95
Murat Doğan
@fion95
Jun 07 2016 09:43
28
Mar10-9us
@Mar10-9us
Jun 07 2016 09:43
Whats the name.
ah
lol.
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:44
I think that's exactly the same one you just answered Mar
Mar10-9us
@Mar10-9us
Jun 07 2016 09:44
Yeah xD
Bruce Hyatt
@mrthnmn
Jun 07 2016 09:44
help twitch
CamperBot
@camperbot
Jun 07 2016 09:44

:point_right: creating twitch account [wiki]

What is Twitch?

Twitch is a live streaming video platform that was founded in June 2011. More than 1.7 million people broadcast on Twitch each month with 100 million unique visitors. Click here to find out more about Twitch and it's statistics.

:pencil: read more about creating twitch account on the FCC Wiki

Bruce Hyatt
@mrthnmn
Jun 07 2016 09:44
help twitch.tv
CamperBot
@camperbot
Jun 07 2016 09:44

:point_right: front end project use twitchtv json api [wiki]

Use the TwitchTV JSON API

If you're trying to tackle this challenge with jQuery's $.getJSON() method, chances are you'll get an error message concerning Cross-Origin Resource Sharing (CORS).

:pencil: read more about front end project use twitchtv json api on the FCC Wiki

Mar10-9us
@Mar10-9us
Jun 07 2016 09:44
@fion95 The link is dead. I dont think its supposed to be? You also have a dot after "cat photos"
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:45
....pretty soon Mar you'll be reading the matrix
Mar10-9us
@Mar10-9us
Jun 07 2016 09:45
@GenghisJohn2016 lol
Murat Doğan
@fion95
Jun 07 2016 09:45
it is supposed to be dead
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:45
@Indalobit what did you need help with?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:46
@fion95 Ok hold on.
Could you give me the title of the challenge?
Murat Doğan
@fion95
Jun 07 2016 09:46
Make Dead Links using the Hash Symbol
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:46
fion, try: <p>Click here for <a href="#">cat photos.</a></p>
renansombra
@renansombra
Jun 07 2016 09:47

got stuck, can somebody help?

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

task: Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.

Murat Doğan
@fion95
Jun 07 2016 09:47
didn't work :/
Mar10-9us
@Mar10-9us
Jun 07 2016 09:47
Ah. You're suppoed to just replace the url with an #. @fion95 Nothing else.
<p>Click here for <a href="#">cat photos</a>.</p>
<p>Click here for <a href="#">cat photos</a>.</p>
hmm
Murat Doğan
@fion95
Jun 07 2016 09:48
I'm clicking run tests but nothing happens
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:49
it looks right....can you show all of your code please?
Mar10-9us
@Mar10-9us
Jun 07 2016 09:49
Just reload the challenge. @fion95 Its easier:P
Murat Doğan
@fion95
Jun 07 2016 09:49

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:50
@fion95 It should work fine
avenger1210
@horizon1210
Jun 07 2016 09:50

<img src="/images/relaxing-cat.jpg">

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

is there any problem?
Size your images
Murat Doğan
@fion95
Jun 07 2016 09:50
it works now, thanks
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:50
Fion I removed mine and put yours in exactly as you typed it, it worked perfectly, try refreshing and/or reporting it as a bug
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:51
@horizon1210 remove one greater than sign at the last.. js </style>
@horizon1210 You've written </style>
</style>>
GenghisJohn2016
@GenghisJohn2016
Jun 07 2016 09:51
thanks @IshtmeetSingh
CamperBot
@camperbot
Jun 07 2016 09:51
genghisjohn2016 sends brownie points to @ishtmeetsingh :sparkles: :thumbsup: :sparkles:
:cookie: 307 | @ishtmeetsingh |http://www.freecodecamp.com/ishtmeetsingh
Cameron Chardukian
@camchardukian
Jun 07 2016 09:53
Hey guys, noob here. Having trouble with this "Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%."
renansombra
@renansombra
Jun 07 2016 09:53
@camchardukian i just solve this one dude
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:54

@camchardukian

p{
font-size: 16px;
}

If it doesn't works, try refreshing browser.

renansombra
@renansombra
Jun 07 2016 09:54

@renansombra smt like this

p {font-size: 16px;}

Cameron Chardukian
@camchardukian
Jun 07 2016 09:55

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

</style>

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

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

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

That's what I would've thought, but am still having problems. Any code look wrong?
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:56
@camchardukian try closing the last <p> tag
<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>
Carlos Gomez
@Indalobit
Jun 07 2016 09:57
I am starting the HTMLcourse but I am stuck in "Comment out HTML" can anyone give me the correct code ? I think I am doing well but....
Cameron Chardukian
@camchardukian
Jun 07 2016 09:57
Ooops, I did, but just didn't copy/paste it here
renansombra
@renansombra
Jun 07 2016 09:57
u missed the </p>
Mar10-9us
@Mar10-9us
Jun 07 2016 09:57
@Indalobit
@Indalobit <!-- -->
Cameron Chardukian
@camchardukian
Jun 07 2016 09:58
even with the </p> I can't get things to clear
Mar10-9us
@Mar10-9us
Jun 07 2016 09:58
@Indalobit <!-- CODE THAT YOU WANT TO COMEMNT OUT --> there.
@Indalobit Understandable?
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:58
@camchardukian You didn't close the .red-text selector on the 2nd line
<style>
  .red-text {
    color: red;
}
    p {
font-size: 16px;
}

</style>

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

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

<p> Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched
   </p>
Carlos Gomez
@Indalobit
Jun 07 2016 09:59
@Mar10-9us yep but I comment h1 and p but the system says not
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 09:59
@Indalobit post your code please.
@camchardukian Did it work?
Stephane
@overmelo
Jun 07 2016 10:00
your red-text class close it with }
Carlos Gomez
@Indalobit
Jun 07 2016 10:01

<h1>Hello World</h1>
-->

<h2>CatPhotoApp</h2>
<!--comment2-->

<p>Hello Paragraph</p>

Stephane
@overmelo
Jun 07 2016 10:01
@camchardukian
Cameron Chardukian
@camchardukian
Jun 07 2016 10:01
with a </style>?
as in
Carlos Gomez
@Indalobit
Jun 07 2016 10:02
I comment p but it says no. right ?
Cameron Chardukian
@camchardukian
Jun 07 2016 10:02

<style>
.red-text
</style>

<style>
color: red;
p {font-size: 16px;}

</style>

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

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

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

Mar10-9us
@Mar10-9us
Jun 07 2016 10:02

@Indalobit Okey. You have misunderstood.

Lets say i have a <p> and <h1> elemtn that i want to comment out.

<h1>Hello</h1>

<p>Hello</p>

The way of doing so would be

Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:02

@camchardukian No on your second line... This one is the right code.

@camchardukian You didn't close the .red-text selector on the 2nd line
```html
<style>
  .red-text {
    color: red;
}
    p {
font-size: 16px;
}

</style>

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

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

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

```

Mar10-9us
@Mar10-9us
Jun 07 2016 10:03

'code'
<!--

<h1>Hello</h1>

<p>Hello</p>
-->

Stephane
@overmelo
Jun 07 2016 10:03
@Indalobit paste what u have done so far
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:04
@Indalobit do it like this, please.
<!--
<h1>Hello World</h1>
-->

<h2>CatPhotoApp</h2>
<!--
<p>Hello Paragraph</p>
-->
@camchardukian You got the code working now?
Cameron Chardukian
@camchardukian
Jun 07 2016 10:05
@IshtmeetSingh Thank you so much. Was stuck on this one for 30+ minutes.
CamperBot
@camperbot
Jun 07 2016 10:05
camchardukian sends brownie points to @ishtmeetsingh :sparkles: :thumbsup: :sparkles:
:cookie: 308 | @ishtmeetsingh |http://www.freecodecamp.com/ishtmeetsingh
renansombra
@renansombra
Jun 07 2016 10:06
stuck :(
Carlos Gomez
@Indalobit
Jun 07 2016 10:06
@Mar10-9us thx very much!!
CamperBot
@camperbot
Jun 07 2016 10:06
indalobit sends brownie points to @mar10-9us :sparkles: :thumbsup: :sparkles:
:cookie: 126 | @mar10-9us |http://www.freecodecamp.com/mar10-9us
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:06
@camchardukian No worries. It happens :)
renansombra
@renansombra
Jun 07 2016 10:06

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

when i close href h2 doesnt work

Carlos Gomez
@Indalobit
Jun 07 2016 10:06
@IshtmeetSingh ok now is done. thx!! so it was asking for convert the h1 and p into coments. right ?
CamperBot
@camperbot
Jun 07 2016 10:06
indalobit sends brownie points to @ishtmeetsingh :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @ishtmeetsingh |http://www.freecodecamp.com/ishtmeetsingh
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:07
@Indalobit Yes it was asking you to comment the h1 and p tags.
@camperbot thanks
CamperBot
@camperbot
Jun 07 2016 10:07
ishtmeetsingh sends brownie points to @camperbot :sparkles: :thumbsup: :sparkles:
:star2: 1846 | @camperbot |http://www.freecodecamp.com/camperbot
renansombra
@renansombra
Jun 07 2016 10:08
help :s
CamperBot
@camperbot
Jun 07 2016 10:08

:point_right: accessibility [wiki]

Accessibility Basics

"The Dark Arts are many, varied, ever-changing, and eternal. Fighting them is like fighting a many-headed monster, which, each time a neck is severed, sprouts a head even fiercer and cleverer than before. You are fighting that which is unfixed, mutating, indestructible."

--Professor Severus Snape, Harry Potter Series

:pencil: read more about accessibility on the FCC Wiki

Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:09
@renansombra with what?
renansombra
@renansombra
Jun 07 2016 10:10
wow...

I was closing href call this way:

<1-- (...) -->

sorry, there were paragrahps between them and it wasnt working till i remove them
doesnt make much sense...
wasnt working
Stephane
@overmelo
Jun 07 2016 10:14
@IshtmeetSingh sorted?
@renansombra paste your whole code
Ishtmeet Singh
@IshtmeetSingh
Jun 07 2016 10:14
@overmelo He said, he got it working.
renansombra
@renansombra
Jun 07 2016 10:15
i managed to pass through it, just wasnt working due to call placement
Stephane
@overmelo
Jun 07 2016 10:16
ok
nira
@Niraly
Jun 07 2016 10:19
.<"
.<"

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

<p>Things cats love:</p>

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

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

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

<input type="text">

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

what did i do wrong?
Add a placeholder attribute text input element.
Set the value of your placeholder attribute to "cat photo URL".
The finished input element should have valid syntax.
plz someone help >.<"
renansombra
@renansombra
Jun 07 2016 10:21

.smaller-image {
width: 100px;
}

not sure what is worng '-'

nira
@Niraly
Jun 07 2016 10:21
anyone?
Jontwa
@Jontwa
Jun 07 2016 10:22
hi guys. how can i "target the same element with multiple jQuery Selectors"?
whats wrong @Niraly ?
nira
@Niraly
Jun 07 2016 10:23

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

<p>Things cats love:</p>

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

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

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

<input type="text">

<input type="text" placeholder="cat photo URL">
what did i do wrong?
Add a placeholder attribute text input element.
Set the value of your placeholder attribute to "cat photo URL".
The finished input element should have valid syntax.
plz someone help >.<"

thats wrong
Waleed Assaf
@Jinxlaw
Jun 07 2016 10:25
anyone know why my Space is deleting code
?
renansombra
@renansombra
Jun 07 2016 10:26
is your INSERT key on?
maybe;;;
Waleed Assaf
@Jinxlaw
Jun 07 2016 10:27
think i fixed it
nira
@Niraly
Jun 07 2016 10:27
plz can anyone help?
Stephane
@overmelo
Jun 07 2016 10:27
<input type="text"> @Niraly delete it i guess
Waleed Assaf
@Jinxlaw
Jun 07 2016 10:27
had to refresh lol
Stephane
@overmelo
Jun 07 2016 10:28
@Jontwa paste what u have done so far
nira
@Niraly
Jun 07 2016 10:28
thanks >.<"
renansombra
@renansombra
Jun 07 2016 10:29

.smaller-image {
width: 100px;
}

whats wrong? :(

Your img element should have the class smaller-image.
Jontwa
@Jontwa
Jun 07 2016 10:30
re-write the code @Niraly ... start at the beginning of the given assignment. I normally do that when am stuck, it always works out coz u'll know what went wrong!!
<script>
$(document).ready(function() {

});
</script>
Stephane
@overmelo
Jun 07 2016 10:31
@renansombra your code might be wrong in html
renansombra
@renansombra
Jun 07 2016 10:31
i dont get it
Jontwa
@Jontwa
Jun 07 2016 10:31
@overmelo i need to target the same elements with multiple jquery selectors
Stephane
@overmelo
Jun 07 2016 10:34
@renansombra paste your whole code. error can be anywhere not just from your <style>
Jontwa
@Jontwa
Jun 07 2016 10:34
@renansombra go back to your html and try to locate the smaller image class and correct it, the css is'nt able to fetch the code coz it cant recognize it. maybe typing error or so!!
joaoinglessilva
@joaoinglessilva
Jun 07 2016 10:49

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

<form action="/submit-cat-photo"></form>

I´m missing the nest your text input element within a form element... can someone help?
Ramesh syangtan
@rameshsyn
Jun 07 2016 10:59
@joaoinglessilva
it says you to put input tag in form tag :smile: like this
<form action="/submit-cat-photo">
      <input type="form" placeholder="cat photo URL">
</form>
Wiesiek
@Wiesiek2811
Jun 07 2016 11:00

Hi, I hope someone can help me, my challenger is this : Only add one class with each of your three selectors.

I have this, where have i gone wrong?

<script>
$(document).ready(function() {
$("button").addClass("animated shake");
$(".btn") .addClass("animated shake");
$("#target1").addClass("animated shake");
});
</script>

Ramesh syangtan
@rameshsyn
Jun 07 2016 11:03
@Wiesiek2811 like this:
$(document).ready(function() {
   $("button, .btn, #target1").addClass("animated shake");
})
Wiesiek
@Wiesiek2811
Jun 07 2016 11:03
ahh thank you!!
Ramesh syangtan
@rameshsyn
Jun 07 2016 11:04
:smile:
Kartikeya Kumar
@xln8kartik
Jun 07 2016 11:04
Can someone please help?
Waleed Assaf
@Jinxlaw
Jun 07 2016 11:05
what does it mean by
Your p element should contain the first few words of the provided additional kitty ipsum text.
Ramesh syangtan
@rameshsyn
Jun 07 2016 11:06
@xln8kartik what's the problem ??
@waleed39 it saying that :smile: : put some text in p element like this <p> kitty ipsum text</p>
renansombra
@renansombra
Jun 07 2016 11:15
whyyyyyyyyyyyyyyyyyyyyyyy whats wrong i dont get it

<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;
}
.smaller-image {
width: 100px;
}
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>

Corber
@davidcorber
Jun 07 2016 11:16
Hello everybody ! :)
Ramesh syangtan
@rameshsyn
Jun 07 2016 11:17
hello @davidcorber :smile:
Kartikeya Kumar
@xln8kartik
Jun 07 2016 11:17

challenge : Change the Font Size of an Element.
Objective remaining : Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
Can't figure out whats wrong.
my code :

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

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

<p class = "red-text">Kitty ipsum dolor sit amet.</p>
<p>Purr jump eat the grass rip the couch scratched sunbathe</p>

Corber
@davidcorber
Jun 07 2016 11:18
A question about pictures storage, could someone have an idea about how instagram compress the picture (in a technical way) they put some script somewhere in the upload ? :)
Ramesh syangtan
@rameshsyn
Jun 07 2016 11:20
@xln8kartik add style to p element :smile: like this
<style>
    p {
   font-size: 16px;
}
</style>