These are chat archives for FreeCodeCamp/Help

21st
Mar 2017
chiocke24
@chiocke24
Mar 21 2017 00:00
<p> here's a <a href="http://freecatphotoapp.com">cat photos</a> link for anyone who cares to follow</p>
still telling me its not right
barnonahill
@barnonahill
Mar 21 2017 00:01
Hm I just got it working by applying CSS to a class instead of h1.class .... Odd, but I'll take it :P
ShoX99
@ShoX99
Mar 21 2017 00:02
try copy pasting mines
dont copy and paste from the example they give u
barnonahill
@barnonahill
Mar 21 2017 00:02
Another question: I'm having trouble reducing the paragraph size inside a jumbotron. I've tried setting size using em in p.jumbotron, but it's not having results. Anyone have an idea as to why?
chiocke24
@chiocke24
Mar 21 2017 00:04
i copy and pasted but it still says its wrong
Jasdeep Singh
@jay-dee7
Mar 21 2017 00:04
<h1 id="status></h1>
$(document).ready(function(){
  // FCC Stream info and status

  var url="https://wind-bow.gomix.me/twitch-api/streams/freecodecamp";
  $.getJSON(url, function(data){
    if(data.stream===null){
      $("status").html("Free Code Camp is currently OFFLINE!!!");

      console.log(data.stream)
    }
    else{
     $("#status").html("Free Code Camp is currently ONLINE!!!");
    } 
    }
  )


}); //DOC READY END
and it displays nothing. can anybody tell me why?
h1 element has double quotes bdw
ShoX99
@ShoX99
Mar 21 2017 00:06
@chiocke24 i tried my code again and it worked. so try refreshing ur page then try again
barnonahill
@barnonahill
Mar 21 2017 00:06
Oh gosh that formatting I'm so sorry
ShoX99
@ShoX99
Mar 21 2017 00:07
this is the 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>

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

<p> View more cat photos , but where only <a href="http://www.freecatphotoapp.com">cat photos</a>is a link, and the rest of the text is plain text.</p>

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

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

chiocke24
@chiocke24
Mar 21 2017 00:10
okay I got it, my code was right but it wasn't registering until I refreshed the page
thanks
barnonahill
@barnonahill
Mar 21 2017 00:11
Any idea as to why I can't get my jumbotron font-size to change guys?
p.jumbotron {
  font-size: 5em;
}
<body>
  <div class="container-fluid">
    <h1 class="text-center document-top name-header">Galileo Galilei</h1>
    <h2 class="text-center document-top lifespan-header">1564 - 1642</h2>
    <h2 class="text-center document-top">The scientist who was unafraid to stand against authority in the name of truth</h2>
    <div class="jumbotron">
      <div class="row non-xs-row">
        <div class="col-sm-5 col-xs-12">
          <a href="http://www.universetoday.com/wp-content/uploads/2009/12/Galileo_Demonstrating_the_New_Astronomical_Theories_at_the_University_of_Padua_-_Google_Art_Project-e1446671809433.jpg" target="_blank">
            <img class="img-responsive" src="_images\Galileo_Demonstrating.jpg" alt="Galileo demonstrating the new Astronomical Theories of the time"></img>
          </a>
        </div>
        <div class="col-xs-12 visible-xs">&nbsp;</div> <!-- Mobile-device line break -->
        <br class="visible-xs"/>
        <div class="col-sm-7 col-xs-12">
          <p>Galileo Galilei was an Italian scientist who played a major role in the <a href="https://en.wikipedia.org/wiki/Scientific_revolution" target="_blank">scientific revolution</a> of the seventeenth century. He was the first person to use a telescope, invented in 1608 for astronomical purposes. Galileo championed Copernicus' Heliocentric Model that Earth and the other planets revolve around the sun. This was in opposition to the accepted model for over a thousand years, the Greek Geocentric Model, where everything in the Universe revolves around the Sun. </p>
        </div>
      </div>
    </div>
  </div>
</body>
Herman Fassett
@HermanFassett
Mar 21 2017 00:12
why p?
I'm rusty with css, but doesn't that only apply to p tags with class jumbotron? Your jumbotron is a div
barnonahill
@barnonahill
Mar 21 2017 00:12
...I'm a fool
ingtapasya
@ingtapasya
Mar 21 2017 00:13

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

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 rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.??? HELP!
barnonahill
@barnonahill
Mar 21 2017 00:14
You're using html elements inside your CSS
What you want is this p.red-text { }
Alex
@AlexandriaKemp
Mar 21 2017 00:15
Can someone tell me whre to insert the <i> element in a button for putting a Font Awesome thumbs up?
Jasdeep Singh
@jay-dee7
Mar 21 2017 00:15

@ingtapasya

.red-text{
font-size : 16px;
}

would just do it

it should
timrkn
@timrkn
Mar 21 2017 00:16
@AlexandriaKemp like this "<button class="btn"><i class="fa fa-paper-plane"></i>Send</button>"
Alex
@AlexandriaKemp
Mar 21 2017 00:17
ah, beautiful, thanks @timrkn!
CamperBot
@camperbot
Mar 21 2017 00:17
alexandriakemp sends brownie points to @timrkn :sparkles: :thumbsup: :sparkles:
:cookie: 2 | @timrkn |http://www.freecodecamp.com/timrkn
barnonahill
@barnonahill
Mar 21 2017 00:18
Still having trouble resizing paragraphs inside my jumbotron, but using correct CSS this time. Ideas?
#main {
  font-size: 5em;
}
<body>
  <div class="container-fluid">
    <h1 class="text-center document-top name-header">Galileo Galilei</h1>
    <h2 class="text-center document-top lifespan-header">1564 - 1642</h2>
    <h2 class="text-center document-top">The scientist who was unafraid to stand against authority in the name of truth</h2>
    <div class="jumbotron" id="main">
      <div class="row non-xs-row">
        <div class="col-sm-5 col-xs-12">
          <a href="http://www.universetoday.com/wp-content/uploads/2009/12/Galileo_Demonstrating_the_New_Astronomical_Theories_at_the_University_of_Padua_-_Google_Art_Project-e1446671809433.jpg" target="_blank">
            <img class="img-responsive" src="_images\Galileo_Demonstrating.jpg" alt="Galileo demonstrating the new Astronomical Theories of the time"></img>
          </a>
        </div>
        <div class="col-xs-12 visible-xs">&nbsp;</div> <!-- Mobile-device line break -->
        <div class="col-sm-7 col-xs-12">
          <p>Galileo Galilei was an Italian scientist who played a major role in the <a href="https://en.wikipedia.org/wiki/Scientific_revolution" target="_blank">scientific revolution</a> of the seventeenth century. He was the first person to use a telescope, invented in 1608 for astronomical purposes. Galileo championed Copernicus' Heliocentric Model that Earth and the other planets revolve around the sun. This was in opposition to the accepted model for over a thousand years, the Greek Geocentric Model, where everything in the Universe revolves around the Sun. </p>
        </div>
      </div>
    </div>
  </div>
</body>
ingtapasya
@ingtapasya
Mar 21 2017 00:19
Hi Jasdeep.. showing the same error..
Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
Antoine Stimphil
@AntoineDS
Mar 21 2017 00:20
Hello everyone, anyone who understands Java?
figb33
@figb33
Mar 21 2017 00:20
i need help
barnonahill
@barnonahill
Mar 21 2017 00:21
Yes Antoine
Antoine Stimphil
@AntoineDS
Mar 21 2017 00:22
I'm creating a TicTacToe program, and I'm trying to figure out why the program is not detecting a win
figb33
@figb33
Mar 21 2017 00:27
im trying to make a dead link with a href attribute ste to #. does that mean i just replace "href" with "#"?
Junyi She
@OliverTheGamer
Mar 21 2017 00:27
Hi guys

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

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
They want my css to be blue, help?

They say its not blue :(
I'm new so haha tell me if im wrong
barnonahill
@barnonahill
Mar 21 2017 00:30
Anybody able to help me out?
Gustavo Silva
@gsilvapt
Mar 21 2017 00:30
@OliverTheGamer you have to put things between quotes - " "
micojay020
@micojay020
Mar 21 2017 00:30
@figb33 no
Gustavo Silva
@gsilvapt
Mar 21 2017 00:30
h2 { "color": "blue"}; is the right command
micojay020
@micojay020
Mar 21 2017 00:30
@figbi u put the "#"
Gustavo Silva
@gsilvapt
Mar 21 2017 00:30
And the text itself shouldn't be inside the <style> parameters
micojay020
@micojay020
Mar 21 2017 00:30
it should be href="#"
Clemus Johnson
@clemaphia
Mar 21 2017 00:32
It has been awhile since I been coding, just got back into the swing of things.
Gustavo Silva
@gsilvapt
Mar 21 2017 00:32
leave the text for your html section. When you predefine the document to use the color blue for all h2, whenever you <h2>use this tag</h2> it will automatically become blue
@OliverTheGamer ^
Junyi She
@OliverTheGamer
Mar 21 2017 00:32
im new D: i have no idea what it means HAHA
Gustavo Silva
@gsilvapt
Mar 21 2017 00:32
Sure, take your time. Hopefully I could explain the problem clearly
Manish Giri
@Manish-Giri
Mar 21 2017 00:32
@ingtapasya did you get done with that problem?
Jose C Villegas
@jvillegas0831
Mar 21 2017 00:33
how can i link my html file to my css file?
Junyi She
@OliverTheGamer
Mar 21 2017 00:33
gtg thanks guys!!
Im in class rn haha
Shikazuka
@Arthareza
Mar 21 2017 00:33
hey guys i wanna ask something i'm working my tribute page
how did i make make img to center
is it align="center" ?
barnonahill
@barnonahill
Mar 21 2017 00:34
css selectors and properties don't need to be inside quotes.. that's jQuery you're thinking of
Clemus Johnson
@clemaphia
Mar 21 2017 00:34
I am trying to use the Lobster font in the font-family for my h2 element however after downloading the font and applying this to the text command, the program will not run
this is my text command h2{ font-family: Lobster; }
Zi
@15liuzi
Mar 21 2017 00:37
blob
how would i set the value for private property gear...
Manish Giri
@Manish-Giri
Mar 21 2017 00:39
@15liuzi line 24
just =
not +=
jibil
@jibil
Mar 21 2017 00:40
Can someone help with this error message:
Zi
@15liuzi
Mar 21 2017 00:40
@Manish-Giri thanks man!
CamperBot
@camperbot
Mar 21 2017 00:40
15liuzi sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4857 | @manish-giri |http://www.freecodecamp.com/manish-giri
jibil
@jibil
Mar 21 2017 00:40
Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
Manish Giri
@Manish-Giri
Mar 21 2017 00:40
@15liuzi :sparkles:
jibil
@jibil
Mar 21 2017 00:40
Here's the code:
<style>
.red-text {
color: red;
}
.p {font-size: 16px;}
</style>
Greg Frayre
@gfrayre
Mar 21 2017 00:40
Hello can I get some help with the current code. TY
Manish Giri
@Manish-Giri
Mar 21 2017 00:40
remove the . in front of p @jibil
Greg Frayre
@gfrayre
Mar 21 2017 00:40

</style>

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

Devin Rooney
@devinrooney895
Mar 21 2017 00:41
how do I set the code up so that my img is 100px
jibil
@jibil
Mar 21 2017 00:41
Thanks @Manish-Giri
CamperBot
@camperbot
Mar 21 2017 00:41
jibil sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4858 | @manish-giri |http://www.freecodecamp.com/manish-giri
Devin Rooney
@devinrooney895
Mar 21 2017 00:43
how do I do the code img to make the image a 100px
Gustavo Silva
@gsilvapt
Mar 21 2017 00:46
@gfrayre what's the problem?
Roxroy
@roxroy
Mar 21 2017 00:47
@devinrooney895 , you can set the height and/or width to a specific px size.
Greg Frayre
@gfrayre
Mar 21 2017 00:48
Screen Shot 2017-03-20 at 5.39.41 PM.png
@gsilvapt heres my code
Paolo Solis
@Xander19
Mar 21 2017 00:48
Create a class called silver-background with the background-color of silver. Assign this class to your div element.
Manish Giri
@Manish-Giri
Mar 21 2017 00:48
@gfrayre close the } first
for pink-text
Gustavo Silva
@gsilvapt
Mar 21 2017 00:48
yea
Paolo Solis
@Xander19
Mar 21 2017 00:49
div .silver-background {background-color: silver;
}
Gustavo Silva
@gsilvapt
Mar 21 2017 00:49
You didn't close the parenthesis of the pink-text class
Paolo Solis
@Xander19
Mar 21 2017 00:49
is this ok?
Gustavo Silva
@gsilvapt
Mar 21 2017 00:49
no need to call div in the style attributes
the .silver does that for you
Paolo Solis
@Xander19
Mar 21 2017 00:49
thank you Gustavo
that solved my problem!
Gustavo Silva
@gsilvapt
Mar 21 2017 00:50
:+1:
William Reynolds
@snaketooth10k
Mar 21 2017 00:52
Hey all, I'm having some issues with jQuery's .animate().
Devin Rooney
@devinrooney895
Mar 21 2017 00:52
how would I set the img width to 100px @roxroy
William Reynolds
@snaketooth10k
Mar 21 2017 00:53
I'm using a callback to remove an element after the animation completes, but the element does not get removed when using the .remove()
Gustavo Silva
@gsilvapt
Mar 21 2017 00:53
@snaketooth10k can you show the code, please?
William Reynolds
@snaketooth10k
Mar 21 2017 00:53
Sure
I can just put it in <code> tags right?
Roxroy
@roxroy
Mar 21 2017 00:54
@devinrooney895 , try height: 100px; width: 100px; in the style
Gustavo Silva
@gsilvapt
Mar 21 2017 00:54
here? Plain copy paste or use ` in the beginning and another at the end to use markdown's syntax highlighting feature
William Reynolds
@snaketooth10k
Mar 21 2017 00:55

HTML:

<div class="d-flex justify-content-center">
<div class="col-md-5 text-center" id="searchContainer">
<form class="form-control">
<div class="col-12">
<label class="form-control" for="wiki-query">Wikipedia Search</label>
</div>
<div class="">
<input type="search" for="wiki-query" class="form-control" placeholder="e.g. Harry Potter">
</div>
<div class="mt-2">
<button for="wiki-query" id="search" class="btn btn-primary form-control">Search</button>
</div>
<div class="mt-2">
<button for="wiki-query" id="random" class="btn btn-danger form-control">Random</button>
</div>
</form>
</div>
</div>

function searchWiki() {
$("#searchContainer").fadeOut(400, function() {
$("this").remove();
});
Jose R Perez
@perezvenegas
Mar 21 2017 00:55
help with the following please"Give your body element the color property of green." and "Your h1 element should inherit the color green from your body element."
Gustavo Silva
@gsilvapt
Mar 21 2017 00:56
there's nothing to remove in your codem @snaketooth10k
William Reynolds
@snaketooth10k
Mar 21 2017 00:56

The JS is just the relevant snippet. When I run that bit of JS, I see the fade, but the element never disappears. This is triggered by an .on() event as such:
$(document).ready(function() {
$("#search").on("click", searchWiki);

});

Shouldn't $("this").remove() remove the element?
Ashraful Islam
@iashraful
Mar 21 2017 00:57
^
"this" <-- string
$(this).remove()
^ correction
Gustavo Silva
@gsilvapt
Mar 21 2017 00:58
i think that works as @iashraful said
William Reynolds
@snaketooth10k
Mar 21 2017 00:58
Ah. I fixed that. Issue persists though. Item fades and disappears for an nth of a second before reappearing.
Ashraful Islam
@iashraful
Mar 21 2017 00:58
@snaketooth10k what do you mean reappearing?
William Reynolds
@snaketooth10k
Mar 21 2017 00:59
If you want the full code it's at http://codepen.io/snaketooth10k/pen/zZpGVa
It almost blinks out. But it comes back almost immediately
Ashraful Islam
@iashraful
Mar 21 2017 00:59
@snaketooth10k what blinks out and comes back? can you give me details so I can check?
William Reynolds
@snaketooth10k
Mar 21 2017 01:00
The #searchContainer does. The whole thing should be removed from the DOM
kanfilsimo
@kanfilsimo
Mar 21 2017 01:00
made few changes... pls tell me what i could fix to make it Oscar worthy :)
Gustavo Silva
@gsilvapt
Mar 21 2017 01:00
Could it be the issue with target=_black!?
Ashraful Islam
@iashraful
Mar 21 2017 01:00
@snaketooth10k ah I see, so it should just disappear?
William Reynolds
@snaketooth10k
Mar 21 2017 01:01
Seems so
Gustavo Silva
@gsilvapt
Mar 21 2017 01:01
@snaketooth10k and show the wikipedia page?
William Reynolds
@snaketooth10k
Mar 21 2017 01:01
I've also tried to set it up using animate.css, removing the element when the animationend event triggers, but that didn't work either.
Gustavo Silva
@gsilvapt
Mar 21 2017 01:02
If you're trying to open an external link, there's the need to add the target="_blank" command
William Reynolds
@snaketooth10k
Mar 21 2017 01:02
@gsilvapt I haven't added that functionality yet, but it's coming.
Gustavo Silva
@gsilvapt
Mar 21 2017 01:02
If you're not trying to do so, I am not of much use :D
William Reynolds
@snaketooth10k
Mar 21 2017 01:02
Right now I have to get that animation to become effective.
Gustavo Silva
@gsilvapt
Mar 21 2017 01:03
Well, I've tried adding target"... and it didn't work
so I have no idea what is happening
Jhezryl
@Jhezryl
Mar 21 2017 01:03
how do I nest col-xs-4 into all my div and btn classes? I can't get it to work
Manish Giri
@Manish-Giri
Mar 21 2017 01:04
@Jhezryl post your code
Jhezryl
@Jhezryl
Mar 21 2017 01:04

</div>

<div class="row col-xs-4">
<button class="btn btn-block btn-primary col-xs-4">Like</button>
<button class="btn btn-block btn-info col-xs-4">Info</button>
<button class="btn btn-block btn-danger col-xs-4">Delete</button>
<button class="btn col-xs-4" type="submit">Submit </button> </div>

Gustavo Silva
@gsilvapt
Mar 21 2017 01:05
I believe you don't need the first `col-xs-4, @Jhezryl
Manish Giri
@Manish-Giri
Mar 21 2017 01:05
@Jhezryl each button should be nested in it's own col-xs-4 div
<div class="col-xs-4">
 <button class="btn btn-block btn-primary">Like</button>
</div>
Jhezryl
@Jhezryl
Mar 21 2017 01:06
oh ok
Gustavo Silva
@gsilvapt
Mar 21 2017 01:06
And then there's that
Jhezryl
@Jhezryl
Mar 21 2017 01:06
let me try that
owenhenry094
@owenhenry094
Mar 21 2017 01:06
need hep here ---> Your p element should have the text "View more " (with a space after it).
Gustavo Silva
@gsilvapt
Mar 21 2017 01:06
@Manish-Giri it should be:
<div class="row"> <div class="col-xs-4"> ...
right?
Manish Giri
@Manish-Giri
Mar 21 2017 01:07
@gsilvapt yup
kanfilsimo
@kanfilsimo
Mar 21 2017 01:07
@Manish-Giri could you pls take a look at my tribute page :) thanks https://codepen.io/kanfilsimo/full/dvJEpm/
CamperBot
@camperbot
Mar 21 2017 01:07
kanfilsimo sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4859 | @manish-giri |http://www.freecodecamp.com/manish-giri
Gustavo Silva
@gsilvapt
Mar 21 2017 01:08
@owenhenry094 what's wrong? :)
Manish Giri
@Manish-Giri
Mar 21 2017 01:08
harambe :sob:
Ashraful Islam
@iashraful
Mar 21 2017 01:08
@snaketooth10k this is really odd behavior
Manish Giri
@Manish-Giri
Mar 21 2017 01:08
rip
Ashraful Islam
@iashraful
Mar 21 2017 01:08
let me see if it is bug in codepen
Jhezryl
@Jhezryl
Mar 21 2017 01:08
THANK YOU IT WORKED!!!!
Manish Giri
@Manish-Giri
Mar 21 2017 01:08
@kanfilsimo looks good!
owenhenry094
@owenhenry094
Mar 21 2017 01:08
@gsilvapt im stuck here ?
Jhezryl
@Jhezryl
Mar 21 2017 01:08
@Manish-Giri thank you
CamperBot
@camperbot
Mar 21 2017 01:08
jhezryl sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4860 | @manish-giri |http://www.freecodecamp.com/manish-giri
kanfilsimo
@kanfilsimo
Mar 21 2017 01:09
@Manish-Giri thanks
CamperBot
@camperbot
Mar 21 2017 01:09
kanfilsimo sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: kanfilsimo already gave manish-giri points
Manish Giri
@Manish-Giri
Mar 21 2017 01:09

@kanfilsimo one suggestion
change this

Here's a link to:-Read more about Harambe

to

Read more about Harambe

and make Harambe the anchor
Gustavo Silva
@gsilvapt
Mar 21 2017 01:09
Can you post your code, @owenhenry094? The text seems intuitive but maybe there's something wrong with the code that you're not showing this way
Ashraful Islam
@iashraful
Mar 21 2017 01:09
@snaketooth10k it works in jsfiddle
^
fadeout happens properly
kanfilsimo
@kanfilsimo
Mar 21 2017 01:11
@Manish-Giri ok :) thanks
CamperBot
@camperbot
Mar 21 2017 01:11
kanfilsimo sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: kanfilsimo already gave manish-giri points
owenhenry094
@owenhenry094
Mar 21 2017 01:11
@gsilvapt i figue out too
Ashraful Islam
@iashraful
Mar 21 2017 01:13
@snaketooth10k ah, its the tether.js
it is causing issues with your fadeOut
if you remove it, the fadeOut works
serv24
@serv24
Mar 21 2017 01:13

Create a CSS class called pink-text that gives an element the color pink.

Give your h1 element the class of pink-text.

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

<h1>Hello World!
</h1>

help me please, what am I doing wrong?
Gustavo Silva
@gsilvapt
Mar 21 2017 01:14
you should add <h1 class="pink-text">, @serv24
serv24
@serv24
Mar 21 2017 01:15
Thank You! @gsilvapt
CamperBot
@camperbot
Mar 21 2017 01:15
serv24 sends brownie points to @gsilvapt :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @gsilvapt |http://www.freecodecamp.com/gsilvapt
Conrad Kay
@conradkay
Mar 21 2017 01:18
var userOnline = 0;
function countOnline(obj) {
  for (let user in obj) {
    if (user[online]) {
      userOnline += 1;
    }
  } 
  return userOnline;
}

console.log(countOnline(users));
^ i am trying to find the number of people online
each user is in a dictionary inside of a larger dictionary
which contains the online attribute which is either true or false.
Gustavo Silva
@gsilvapt
Mar 21 2017 01:21
I think users is not defined in that snippet
What does the console prints?
Austin Duchi
@aduchi16
Mar 21 2017 01:22

<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 rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%.
Conrad Kay
@conradkay
Mar 21 2017 01:23
@gsilvapt it is referring to the biggest dictionary of all of them
@aduchi16 in-between the style tags <style> put
font-size: 16px;
Félix Doyon
@TheOnion7
Mar 21 2017 01:24
@aduchi16 I think it's something to do with add a new p=[something else] entry in your style
Conrad Kay
@conradkay
Mar 21 2017 01:24
put it inside of a `p {
Félix Doyon
@TheOnion7
Mar 21 2017 01:24
@conradkay but with have to assign it to the <p> I think
Conrad Kay
@conradkay
Mar 21 2017 01:24
}
yes @TheOnion7
the full code would be
p {
  font-size: 16px;
}
Félix Doyon
@TheOnion7
Mar 21 2017 01:25
like p= font-size:16px;
oh thats it thanks it's the braces that I dont remembered
;)
Austin Duchi
@aduchi16
Mar 21 2017 01:26
cool and id add that into the existing style
Félix Doyon
@TheOnion7
Mar 21 2017 01:26
yes
Austin Duchi
@aduchi16
Mar 21 2017 01:27
cool thanks @TheOnion7 @conradkay
CamperBot
@camperbot
Mar 21 2017 01:27
:warning: @theonion7's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
aduchi16 sends brownie points to @theonion7 and @conradkay :sparkles: :thumbsup: :sparkles:
:cookie: 278 | @conradkay |http://www.freecodecamp.com/conradkay
Félix Doyon
@TheOnion7
Mar 21 2017 01:28
thanks to @conradkay haha
CamperBot
@camperbot
Mar 21 2017 01:28
theonion7 sends brownie points to @conradkay :sparkles: :thumbsup: :sparkles:
:cookie: 279 | @conradkay |http://www.freecodecamp.com/conradkay
asipey
@asipey
Mar 21 2017 01:28
is this correct
<img class="smaller-image"src="https://images-na.ssl-images-amazon.com/images/G/01/img15/pet-products/small-tiles/30423_pets-products_january-site-flip_3-cathealth_short-tile_592x304._CB286975940_.jpg"alt="A cute orange cat lying on its back. ">
tang3nce
@tang3nce
Mar 21 2017 01:30
If I'm assigning an ID to a form where's the best place to do so in the form after it's been established with <form action... or in the line below it?
Ashraful Islam
@iashraful
Mar 21 2017 01:30
^ looks good
@tang3nce anywhere inside the form tag is fine
Conrad Kay
@conradkay
Mar 21 2017 01:30
@asipey looks fine
what error are you getting
Ashraful Islam
@iashraful
Mar 21 2017 01:31
<form id="blah" action="...."> is same as <form action="..." id="blah"> @tang3nce
CSchwarz81
@CSchwarz81
Mar 21 2017 01:32
exercise 53 - no idea what I am doing here. here is my code. Can't get "your style should have a pink-text css class with it's color set to pink" checked

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

</style>

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

tang3nce
@tang3nce
Mar 21 2017 01:32
thanks guys
Stevenp21
@Stevenp21
Mar 21 2017 01:33
Hello, any idea why this anchor tag is not being accepted by the software?
<a href="freecatphotoapp.com">Cat Photos</a>
Missing the http://?
Austin Duchi
@aduchi16
Mar 21 2017 01:34
i still cant get this to work ;(

<style>
.red-text p {
color: red; text-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 sleep in the sink fluffy fur catnip scratched.</p>

Claudio Restifo
@Marmiz
Mar 21 2017 01:34
@Stevenp21 make sure the url is identical
Stevenp21
@Stevenp21
Mar 21 2017 01:35
Thank you, I adjusted the URL - still no luck
Austin Duchi
@aduchi16
Mar 21 2017 01:35
im trying to change the font size for the <p>
Claudio Restifo
@Marmiz
Mar 21 2017 01:35
@aduchi16 there is no text-size property in CSS, it'sfont-size what you're looking at.
Also make sure that .red-text and p has different properties
Stevenp21
@Stevenp21
Mar 21 2017 01:35
Make an additional statement for the P elements @aduchi16
p {
font-size: 16px;
font-family: Monospace;
}
deaninous
@deaninous
Mar 21 2017 01:36
@CSchwarz81 you nested pink-text inside of body. Try giving pink-text its own brackets and see
Claudio Restifo
@Marmiz
Mar 21 2017 01:36
@Stevenp21 also the text has to be identical as the one asked, also regarding capitalization :+1:
Ignacio Ito
@ignacioito
Mar 21 2017 01:37
Good evening people! Tomorrow more!!! Bye
Austin Duchi
@aduchi16
Mar 21 2017 01:39
it just says to chang the font-size not the font @Stevenp21
im new to this srry idk code talk very well
what do you mean by different properties @Marmiz
Claudio Restifo
@Marmiz
Mar 21 2017 01:43
@aduchi16 I'm pretty sure the challenge is asking you that red-text has some properties, and p has some others.
so you have to differentiate:
.red-text{
  /* my properties */
}

p {
/* other properties */
}
Austin Duchi
@aduchi16
Mar 21 2017 01:44
Inside the same <style> tag that contains your red-text class, create an entry for p elements and set the font-size to 16 pixels (16px). @Marmiz
Claudio Restifo
@Marmiz
Mar 21 2017 01:44

@aduchi16 by writing this:

.red-text p {
/* stuff */
}

You're selecting every p that is a child of an element with a red-text class on it

@aduchi16

Inside the same <style>

not inside the same class

Austin Duchi
@aduchi16
Mar 21 2017 01:45
oh ok makes alot more sense let me try it
jibil
@jibil
Mar 21 2017 01:45
I'm getting this error message "Nest your text input element within a form element."
With this code: <form action="/submit-cat-photo"<input type="text" placeholder="cat photo URL"></form>
Claudio Restifo
@Marmiz
Mar 21 2017 01:46
@jibil haven't closed the first form: missing >
CSchwarz81
@CSchwarz81
Mar 21 2017 01:46
h1 element is not orange... what am I doing wrong.

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

#orange-text {
  color: orange;
}

}
</style>

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

jibil
@jibil
Mar 21 2017 01:48
Ohh thanks! @Marmiz
CamperBot
@camperbot
Mar 21 2017 01:48
jibil sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 744 | @marmiz |http://www.freecodecamp.com/marmiz
Claudio Restifo
@Marmiz
Mar 21 2017 01:50
@CSchwarz81 close properly the blue-text with }:
.blue-text {
color: blue;
    #orange-text {  /* is declared inside blue-text */
         color: orange;
     }
}
Austin Duchi
@aduchi16
Mar 21 2017 01:50

<style>
.red-text p {Font-size= 16px;}
{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 rip the couch sleep in the sink fluffy fur catnip scratched.</p> @Marmiz

Claudio Restifo
@Marmiz
Mar 21 2017 01:52

@aduchi16 again this:

.red-text p

means: select all the p that are children of red-text.

You want to have one class for p and one class for red-text.
Look at the example on the page

asipey
@asipey
Mar 21 2017 01:55
im stuck on this
<img class= "smaller-image" src= "https://images-na.ssl-images-amazon.com/images/G/01/img15/pet-products/small-tiles/30423_pets-products_january-site-flip_3-cathealth_short-tile_592x304._CB286975940_.jpg"alt= "A cute orange cat lying on its back.">
Austin Duchi
@aduchi16
Mar 21 2017 01:55
but where do i put the .red-text p in the code inside the styles @Marmiz
asipey
@asipey
Mar 21 2017 01:55
it says Your img element should have the class smaller-image.
badalsaibo
@heyDante
Mar 21 2017 01:57
@asipey you created the class .smaller-image ?
Claudio Restifo
@Marmiz
Mar 21 2017 01:57

@aduchi16 they have to be two separate entities:

.red-text: {  stuff }

p {  stuff }

The previous syntax is TOTALLY different from the one you were using:

.red-text p { stuff }
FistCake
@FistCake
Mar 21 2017 01:57
hey all! stuck on another problem. it's telling me to give my div element the class silver-background but for some reason when I do that the .silver-background is highlighted.

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

div {
.silver-background {
background-color: silver;
}
</style>

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

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

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

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

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

Claudio Restifo
@Marmiz
Mar 21 2017 01:59

@FistCake

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

you don't need the div part

SirrEric
@SirrEric
Mar 21 2017 01:59

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> my image wont become 100px

my image wont become 100PX*
asipey
@asipey
Mar 21 2017 01:59
@heyDante yes
SirrEric
@SirrEric
Mar 21 2017 01:59
can someone help please
asipey
@asipey
Mar 21 2017 01:59
<style>
.smaller-image {
width: 100px;
}
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>
FistCake
@FistCake
Mar 21 2017 01:59
@Marmiz Oh okay! Thank you!
CamperBot
@camperbot
Mar 21 2017 01:59
fistcake sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 745 | @marmiz |http://www.freecodecamp.com/marmiz
Austin Duchi
@aduchi16
Mar 21 2017 01:59
dude thanks alot @Marmiz
CamperBot
@camperbot
Mar 21 2017 01:59
aduchi16 sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 746 | @marmiz |http://www.freecodecamp.com/marmiz
Brandon Zamorano
@BrandonZamorano
Mar 21 2017 02:00
@SirrEric Add the .smaller-image class to your img element.
Claudio Restifo
@Marmiz
Mar 21 2017 02:00
@aduchi16 @FistCake :+1:
badalsaibo
@heyDante
Mar 21 2017 02:00
@asipey your code looks fine then, try to refresh and run it again.
A bit concerned about the image url you have provided
looks different than the others
Israel Merljak
@imerljak
Mar 21 2017 02:01
need help with the TwitchAPI challenge.. i cant finish my api call cause of CORS, even if i'm using crossorigin.me (i've tested the api url in browser and it works fine)
https://codepen.io/imerljak/pen/aJqRgE
it's far from being done.. i'm just setting up the base code and testing the api calls.
badalsaibo
@heyDante
Mar 21 2017 02:02
@SirrEric you have not added the class smaller-image to your img element
SirrEric
@SirrEric
Mar 21 2017 02:02
@BrandonZamorano <img class="smaller-image" src= like that??
Brandon Zamorano
@BrandonZamorano
Mar 21 2017 02:03
@SirrEric Looks right
SirrEric
@SirrEric
Mar 21 2017 02:03
@BrandonZamorano k thanks
CamperBot
@camperbot
Mar 21 2017 02:03
sirreric sends brownie points to @brandonzamorano :sparkles: :thumbsup: :sparkles:
:cookie: 255 | @brandonzamorano |http://www.freecodecamp.com/brandonzamorano
Brandon Zamorano
@BrandonZamorano
Mar 21 2017 02:03
np :smile:
badalsaibo
@heyDante
Mar 21 2017 02:04
@imerljak https://gitter.im/FreeCodeCamp/HelpJavaScript These guys might help
SirrEric
@SirrEric
Mar 21 2017 02:05
@BrandonZamorano soo i had it right the entire time but i forgot to put the parenthesis
Claudio Restifo
@Marmiz
Mar 21 2017 02:05
@imerljak why you chose to use crossorigin? doesn't Twitch serves its API via https?
Israel Merljak
@imerljak
Mar 21 2017 02:05
thanks @heyDante
CamperBot
@camperbot
Mar 21 2017 02:05
imerljak sends brownie points to @heydante :sparkles: :thumbsup: :sparkles:
:cookie: 594 | @heydante |http://www.freecodecamp.com/heydante
Israel Merljak
@imerljak
Mar 21 2017 02:06
@Marmiz cause it isnt working event without it lol..
Manish Giri
@Manish-Giri
Mar 21 2017 02:10
@imerljak isn't gomix renamed to glitch now?
Israel Merljak
@imerljak
Mar 21 2017 02:10
@Manish-Giri THANK YOU!
CamperBot
@camperbot
Mar 21 2017 02:10
imerljak sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4861 | @manish-giri |http://www.freecodecamp.com/manish-giri
asipey
@asipey
Mar 21 2017 02:11

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

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

h2 {
font-family: Lobster, Monospace;
}

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

<h2 class="red-text">CatPhotoApp</h2>
<img class= "smaller-image" src= "https://images-na.ssl-images-amazon.com/images/G/01/img15/pet-products/small-tiles/30423_pets-products_january-site-flip_3-cathealth_short-tile_592x304._CB286975940_.jpg" alt= "A cute orange cat lying on its back.">

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

Israel Merljak
@imerljak
Mar 21 2017 02:11
@Manish-Giri the url in challenge is outdated.
asipey
@asipey
Mar 21 2017 02:11
can u pls help on this im stuck on the img class
Manish Giri
@Manish-Giri
Mar 21 2017 02:12
@imerljak yeah, they're fixing it
freeCodeCamp/freeCodeCamp#14015
which is why you should always use the official API!
indyswk
@indyswk
Mar 21 2017 02:12
@asipey hey, was about to get help on this as well
Israel Merljak
@imerljak
Mar 21 2017 02:12
yeah.. but twitch requires and APIKEY to use
doesn't it?
Manish Giri
@Manish-Giri
Mar 21 2017 02:13
that's literally just 3 more lines of code
maybe even less
indyswk
@indyswk
Mar 21 2017 02:13
i'm stuck there too. image doesn't seem to go 100px
Israel Merljak
@imerljak
Mar 21 2017 02:13
i was just too lazy to actually register for an API key
asipey
@asipey
Mar 21 2017 02:14
im stuck on this Your img element should have the class smaller-image. @indyswk
indyswk
@indyswk
Mar 21 2017 02:17
@asipey My code looks the same, but the "img element with class smaller-image" was passed. But, "Your image should be 100 pixels wide. Browser zoom should be at 100%" did not. I have no idea.
WingleWanger
@WingleWanger
Mar 21 2017 02:17
im stuck on the "turn an image into a link", everything is checked off except nesting the img, and i did it as the example says and its still not working, can i get some help?
indyswk
@indyswk
Mar 21 2017 02:18
Also did the
".smaller-image {
width: 100px;
}"
in between the <style> tags... pretty much like yours
I'm stumped
mmasales
@mmasales
Mar 21 2017 02:19
@asipey code should look like this: <img src="https://bit.ly/fcc-relaxing-cat" class="smaller-image" alt="A cute orange cat lying on its back. ">
currently, you're using <img class ="smaller image"
all you need to do is remove <img
and just put class="smaller-image"

@asipey

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

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

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

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

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

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

indyswk
@indyswk
Mar 21 2017 02:22
I looked through both @asipey 's code didn't see "smaller image" ?
anyway, I copied that code into mine, still didn't work. "Your image should be 100 pixels wide. Browser zoom should be at 100%." still didn't pass
Anissa
@Anissa210
Mar 21 2017 02:23
I don't know why my h2 element wont turn blue
mmasales
@mmasales
Mar 21 2017 02:24
@indyswk is your browser on 100% zoom? if you're on a MAC , press command and +
indyswk
@indyswk
Mar 21 2017 02:25
on Firefox, it's 100%
mmasales
@mmasales
Mar 21 2017 02:25
still didnt pass?
Anissa
@Anissa210
Mar 21 2017 02:25
Or don't help. Cool.
indyswk
@indyswk
Mar 21 2017 02:25
*on Windows Firefox
Ajith
@ajithvallabai
Mar 21 2017 02:28
<img> tag was not closed
Anissa
@Anissa210
Mar 21 2017 02:30
can someone help please?
11 people reading my comments, thought this was what this chat was for
Ajith
@ajithvallabai
Mar 21 2017 02:30
@Anissa210 show your code
Anissa
@Anissa210
Mar 21 2017 02:31

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

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

Ajith
@ajithvallabai
Mar 21 2017 02:31
where is your h2 element ?
in html?
Anissa
@Anissa210
Mar 21 2017 02:32
idk what happened
i was doing good no problems till this lol
Ajith
@ajithvallabai
Mar 21 2017 02:33
<h2>...some text ..</h2> this would make it work
mmasales
@mmasales
Mar 21 2017 02:33
you need to set an h2 element, so <h2>CatPhotoApp</h2>
WingleWanger
@WingleWanger
Mar 21 2017 02:33
can i get some help real quick?
Anissa
@Anissa210
Mar 21 2017 02:33
ohhh
thanks
indyswk
@indyswk
Mar 21 2017 02:34
FYI, I solved it. It was an issue with the font family instead.. (weird how THAT passed before)
Ajith
@ajithvallabai
Mar 21 2017 02:34
@WingleWanger let me try
KeyWiz101
@KeyWiz101
Mar 21 2017 02:34
should the .red-text be in between the curly bracers or outside of them?
Ajith
@ajithvallabai
Mar 21 2017 02:34
outside
Claudio Restifo
@Marmiz
Mar 21 2017 02:34
@WingleWanger ask your question and show any relevant code
WingleWanger
@WingleWanger
Mar 21 2017 02:34
@ajithvallabai <a href="#"><img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera."></a> i have check marks on everything EXCEPT the nesting the img element into the anchor element, what am i doing wrong?
KeyWiz101
@KeyWiz101
Mar 21 2017 02:35
Ok after i added them above the curly bracers after the h2 it takes the color red away from text where should it placed?
<style>
h2 .red-text{
color: red;
}
</style>
WingleWanger
@WingleWanger
Mar 21 2017 02:37
now go down to your <h2> and make it <h2 class="red-text"> @KeyWiz101
KeyWiz101
@KeyWiz101
Mar 21 2017 02:38
@WingleWanger Ok i added the element to my h2 and my font is still black

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

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

is my .red-text in the wrong spot?
WingleWanger
@WingleWanger
Mar 21 2017 02:38
try just putting a space between the first bracket
KeyWiz101
@KeyWiz101
Mar 21 2017 02:39
no still black.
Ajith
@ajithvallabai
Mar 21 2017 02:39
@WingleWanger was any class included in img element?
WingleWanger
@WingleWanger
Mar 21 2017 02:39

and if that doesnt work, just try

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

@ajithvallabai no class
Marc
@marcxvent
Mar 21 2017 02:40
I'm having trouble getting the splice () method to work for the Slasher Flick challenge, anyone able to help?
Ajith
@ajithvallabai
Mar 21 2017 02:40
wat is the challenge name?
KeyWiz101
@KeyWiz101
Mar 21 2017 02:40
@WingleWanger ok thank you WingleWanger :)
CamperBot
@camperbot
Mar 21 2017 02:40
keywiz101 sends brownie points to @winglewanger :sparkles: :thumbsup: :sparkles:
:warning: @winglewanger's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
TheAsianCoder
@HelpISuckAtCoding
Mar 21 2017 02:40
How do i uncomment your h1, and h2 and p elements?
Allen
@Dash0665
Mar 21 2017 02:40
I've been trying to get a nav bar to work the way I want it to with the Brand all the way to the left and the nav all the way to the right. PLEASE HELP
Ajith
@ajithvallabai
Mar 21 2017 02:41
@HelpISuckAtCoding remove <!-- ...--> tag
TheAsianCoder
@HelpISuckAtCoding
Mar 21 2017 02:41
what do i replace it with?
@ajithvallabai
WingleWanger
@WingleWanger
Mar 21 2017 02:41
@KeyWiz101 no problem
Claudio Restifo
@Marmiz
Mar 21 2017 02:42
@Dash0665 you have two version of bootstrap imported. get rid of one (I suppose the v4) and watch the magic happens!
WingleWanger
@WingleWanger
Mar 21 2017 02:42
@Marmiz <a href="#"><img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera."></a> i have check marks on everything EXCEPT the nesting the img element into the anchor element, what am i doing wrong?
KeyWiz101
@KeyWiz101
Mar 21 2017 02:42
So the h2 and .red-text had to be together in order for it to work. h2.red-text before the first {
Ajith
@ajithvallabai
Mar 21 2017 02:43
@WingleWanger no idea .
Allen
@Dash0665
Mar 21 2017 02:43
@Marmiz i just did seems to act the same
Roxroy
@roxroy
Mar 21 2017 02:43
@Dash0665 , go in your setting and delete the line https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css, save and observe
Ajith
@ajithvallabai
Mar 21 2017 02:43
@WingleWanger is it add anchar element within image element?
TheAsianCoder
@HelpISuckAtCoding
Mar 21 2017 02:44
It says make your h1 element visible on your page by unccommenting it?
WingleWanger
@WingleWanger
Mar 21 2017 02:44
"Nest the existing img element within an a element." @ajithvallabai
Jacob
@JMBarsky
Mar 21 2017 02:44
took a break from codecamp and having trouble jumping back into what i was doing. Can anyone please explain how to do this?

Set the Font Family of an Element

You can set an element's font by using the font-family property.

For example, if you wanted to set your h2 element's font to Sans-serif, you would use the following CSS:

h2 {
  font-family: Sans-serif;
}

Make all of your p elements use the Monospace font.
Your p elements should use the font Monospace.

TheAsianCoder
@HelpISuckAtCoding
Mar 21 2017 02:45
Oh never mind i got it lol
Allen
@Dash0665
Mar 21 2017 02:45
@roxroy Thank you so much ive been stuck for days lol
CamperBot
@camperbot
Mar 21 2017 02:45
dash0665 sends brownie points to @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @roxroy |http://www.freecodecamp.com/roxroy
Jacob
@JMBarsky
Mar 21 2017 02:45
i tried placing the part they suggested after <p
Allen
@Dash0665
Mar 21 2017 02:45
@Marmiz thank you
CamperBot
@camperbot
Mar 21 2017 02:45
dash0665 sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 747 | @marmiz |http://www.freecodecamp.com/marmiz
WingleWanger
@WingleWanger
Mar 21 2017 02:45
i got it @ajithvallabai ! put it under the first img instead of the newer one
Claudio Restifo
@Marmiz
Mar 21 2017 02:45
@WingleWanger you copied the example, while on the other hand you should use the image you had previously with class and all that stuff!
@Dash0665 have you saved after deleting v4?
WingleWanger
@WingleWanger
Mar 21 2017 02:46
@Marmiz figured that out just before you said it haha, thanks!
CamperBot
@camperbot
Mar 21 2017 02:46
winglewanger sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 748 | @marmiz |http://www.freecodecamp.com/marmiz
Roxroy
@roxroy
Mar 21 2017 02:47
@Dash0665 , np. BS3 and BS4 confusion is a common problem.
SirrEric
@SirrEric
Mar 21 2017 02:48
What does href stand for??
Jacob
@JMBarsky
Mar 21 2017 02:48
whats the best way for me to link my code so i can ask for correction
Ajith
@ajithvallabai
Mar 21 2017 02:49
@SirrEric hypertext reference
SirrEric
@SirrEric
Mar 21 2017 02:49
@ajithvallabai Thanks
CamperBot
@camperbot
Mar 21 2017 02:49
sirreric sends brownie points to @ajithvallabai :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @ajithvallabai |http://www.freecodecamp.com/ajithvallabai
Ajith
@ajithvallabai
Mar 21 2017 02:49
@JMBarsky you can use " " "" three marks like this - `` at the upper left corner
Rebeca
@rgarn3r
Mar 21 2017 02:49

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6-well">

</div>
<div class="col-xs-6-well">

</div>
</div>
</div>

Nest both of your div elements with the class "col-xs-6" within your div element with the class "row".

I don't know what's missing
Claudio Restifo
@Marmiz
Mar 21 2017 02:50
@JMBarsky pasting relevant code FORMATTED here.
read here to learn how to format:
https://github.com/freeCodeCamp/freeCodeCamp/wiki/Code-Formatting
Andrew Shieh
@andrewlikes
Mar 21 2017 02:50
@rgarn3r col-xs-6
not col-xs-6-well
Rebeca
@rgarn3r
Mar 21 2017 02:51
"well" in another class?
Andrew Shieh
@andrewlikes
Mar 21 2017 02:51
well should be applied to another div
Manish Giri
@Manish-Giri
Mar 21 2017 02:52
@rgarn3r well should be nested in the col-xs-6 div
SirrEric
@SirrEric
Mar 21 2017 02:52

<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 #="http://www.freecatphotoapp.com">cat photos</a>.</p>

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

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

Rebeca
@rgarn3r
Mar 21 2017 02:52
oooh. <div class="well"> </div>
SirrEric
@SirrEric
Mar 21 2017 02:52
i put a dead link in the href spot
LeSean Johnson
@leseanbiz
Mar 21 2017 02:52
has anyone else had any trouble in codepen getting their nav bar for the portfolio page to be horizontal?
Rebeca
@rgarn3r
Mar 21 2017 02:52
I 've tried in this way and not pass
Andrew Shieh
@andrewlikes
Mar 21 2017 02:52
@SirrEric # should be the value of href
SirrEric
@SirrEric
Mar 21 2017 02:52
did i do something wrong ??\
ohhhh
@andrewlikes gotch
@andrewlikes gotcha* thanks
CamperBot
@camperbot
Mar 21 2017 02:53
sirreric sends brownie points to @andrewlikes :sparkles: :thumbsup: :sparkles:
:cookie: 421 | @andrewlikes |http://www.freecodecamp.com/andrewlikes
Andrew Shieh
@andrewlikes
Mar 21 2017 02:53
@rgarn3r make sure div class well is in the right spot
Jacob
@JMBarsky
Mar 21 2017 02:53
  .red-text {
    color: red;
  }

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

<h2 {
    font-family: Monospace;
    }
    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>
did i post that correctly?
LeSean Johnson
@leseanbiz
Mar 21 2017 02:53
yep!
has anyone else had any trouble in codepen getting their nav bar for the portfolio page to be horizontal?
Jacob
@JMBarsky
Mar 21 2017 02:54
ok, what am i doing wrong? these are the instructions

You can set an element's font by using the font-family property.

For example, if you wanted to set your h2 element's font to Sans-serif, you would use the following CSS:

h2 {
  font-family: Sans-serif;
}

Make all of your p elements use the Monospace font.

SirrEric
@SirrEric
Mar 21 2017 02:55
@andrewlikes like this <p>Click here for <a herf="#">cat photos</a>.</p>
Jacob
@JMBarsky
Mar 21 2017 02:55
to make the p elements Monospace, i place that font-family part after the <p?
Andrew Shieh
@andrewlikes
Mar 21 2017 02:55
href
not herf
SirrEric
@SirrEric
Mar 21 2017 02:55
kk
Rebeca
@rgarn3r
Mar 21 2017 02:55
@andrewlikes problem solved
LeSean Johnson
@leseanbiz
Mar 21 2017 02:55
inline style
jacob*
Andrew Shieh
@andrewlikes
Mar 21 2017 02:55
@rgarn3r gj!
Jacob
@JMBarsky
Mar 21 2017 02:56
ooooo! nm nm. i got it. though dont understand why its correct.
LeSean Johnson
@leseanbiz
Mar 21 2017 02:56
you cant just nest css like that
inside of html
the browser has to be told”youre now reading css” in one form or another
Jacob
@JMBarsky
Mar 21 2017 02:56
@Marmiz by the way, thank you. that was helpful
CamperBot
@camperbot
Mar 21 2017 02:56
jmbarsky sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 749 | @marmiz |http://www.freecodecamp.com/marmiz
Ajith
@ajithvallabai
Mar 21 2017 02:56
@leseanbiz u need to adjust with margin-top to 0 and then set position to fixed like that but i am not sure
KeyWiz101
@KeyWiz101
Mar 21 2017 02:58
Ok how to i give the p element a font-size: 30px; within my style?
Ajith
@ajithvallabai
Mar 21 2017 02:59
<p style element>..</p> @KeyWiz101
LeSean Johnson
@leseanbiz
Mar 21 2017 02:59
do i need some query?
query*
fuck
JQUERY
KeyWiz101
@KeyWiz101
Mar 21 2017 03:00
@ajithvallabai does that go in bewteen opening and closing style?
Ajith
@ajithvallabai
Mar 21 2017 03:01
no @leseanbiz
LeSean Johnson
@leseanbiz
Mar 21 2017 03:01
this is just for the portfolio page and im copying other site html that gives them a horizontal navbar and it doesnt work in codepen
Danny Welstad
@GoonTwo
Mar 21 2017 03:02
Could use some help. Trying to take an array of strings and concatenate them using a for loop in Javascript. Not sure why function below isnt working
function wordsToSentence(words) {
  var sentence = '';
  for (var i = 0; i < words.length; i++) {
    sentence = sentence + words[i] + ' ';
  }
  return sentence;
}
Ajith
@ajithvallabai
Mar 21 2017 03:03
@leseanbiz take a look at this website https://bootswatch.com/cosmo/ after many months i came to know about these websites .they give your free snippets of navbars ,buttons and other components you could have it as reference
LeSean Johnson
@leseanbiz
Mar 21 2017 03:04
….i feel like i should try and make it work before full-on copy pasta
Ajith
@ajithvallabai
Mar 21 2017 03:04
@leseanbiz could you show your code
LeSean Johnson
@leseanbiz
Mar 21 2017 03:05
‘''<body>
<div class="container-fluid">
<nav class="navbar navbar-default gray-bg">
<div class="navbar-header">
<a class="navbar-brand nav" href="#">LeSean</a>
</div>
<ul class="nav pull-left">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">about</a></li>
<li><a href="#portfolio">portfolio</a></li>
<li><a href="#contact">contact</a></li>
</ul>
</nav>
<div class="block" id="about">
<p>about</p>
</div>
<div class="block" id="porfolio">
<p>portfolio</p>
</div>
<div class="block" id="contact">
<p>contact</p>
</div>
</div>
</body>’''
Roxroy
@roxroy
Mar 21 2017 03:05
@dannywelstad , is words and array. How are you calling wordsToSentence
LeSean Johnson
@leseanbiz
Mar 21 2017 03:05
oops
    <div class="container-fluid">
        <nav class="navbar navbar-default gray-bg">
            <div class="navbar-header">
                <a class="navbar-brand nav" href="#">LeSean</a>
            </div>
            <ul class="nav pull-left">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#about">about</a></li>
                <li><a href="#portfolio">portfolio</a></li>
                <li><a href="#contact">contact</a></li>
            </ul>     
        </nav>
        <div class="block" id="about">
            <p>about</p>
        </div>
        <div class="block" id="porfolio">
            <p>portfolio</p>
        </div>
        <div class="block" id="contact">
            <p>contact</p>
        </div>
    </div>
</body>
Ajith
@ajithvallabai
Mar 21 2017 03:07
@leseanbiz your css code?
Danny Welstad
@GoonTwo
Mar 21 2017 03:07
@Roxroy words is an array. I am running a script that calls the function and evaluates what it returns for me.
LeSean Johnson
@leseanbiz
Mar 21 2017 03:07
its just bootstrap via codepen
andd 1 background=gray class but nothing else
Danny Welstad
@GoonTwo
Mar 21 2017 03:07
@roxroy how its called shouldn't be a problem.
Roxroy
@roxroy
Mar 21 2017 03:08
@dannywelstad , also try sentence = sentence +" "+ words[i];
Christopher
@ChristopherBurkett
Mar 21 2017 03:08
how do I copy paste my code here to see if you guys can tell me what I am doing wrong?
I am on the Catphoto app
the part to where I have to change the color text
Danny Welstad
@GoonTwo
Mar 21 2017 03:09
@roxroy I'll give it a shot, but I'm not sure it wants a space out front
Allen
@Dash0665
Mar 21 2017 03:09
what does class="block" do?
Stephanie
@SBrooks84591
Mar 21 2017 03:09

Hello all, I am working on the Script Tags challenge, and this code is not working. Any suggestions would be greatly appreciated <script>
$(document).ready (function(){

});
</script>

Ajith
@ajithvallabai
Mar 21 2017 03:09
@leseanbiz you need to add display:block or inline element , set position element , give background much things are there
Roxroy
@roxroy
Mar 21 2017 03:09
@dannywelstad , you can trim the final string
LeSean Johnson
@leseanbiz
Mar 21 2017 03:10
to css?
Ajith
@ajithvallabai
Mar 21 2017 03:10
ya
Claudio Restifo
@Marmiz
Mar 21 2017 03:10

@dannywelstad just tested your code:

wordToSentence(['some', 'word'])
// "some word "

notice the space at the end of sentence.

LeSean Johnson
@leseanbiz
Mar 21 2017 03:11
ok, weird. i didnt have to do that for the tribute page. do you happe to know why i now need to?
do you mean like span?
Christopher
@ChristopherBurkett
Mar 21 2017 03:11
how are you guys copying the code in this chat?
LeSean Johnson
@leseanbiz
Mar 21 2017 03:11
the tilde key
~`
without shift, 3 of those
before and after
Christopher
@ChristopherBurkett
Mar 21 2017 03:12
ty @Marmiz
CamperBot
@camperbot
Mar 21 2017 03:12
christopherburkett sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 750 | @marmiz |http://www.freecodecamp.com/marmiz
Danny Welstad
@GoonTwo
Mar 21 2017 03:12
@Marmiz Once you concatenate all the strings how can you eliminate that last extra space?
Claudio Restifo
@Marmiz
Mar 21 2017 03:13
@dannywelstad trim() it's the easiest/laziest
Danny Welstad
@GoonTwo
Mar 21 2017 03:14
@Marmiz how so? sentence.trim()?
Ajith
@ajithvallabai
Mar 21 2017 03:14
@leseanbiz sorry code will work i think i will check and get back to you
Christopher
@ChristopherBurkett
Mar 21 2017 03:14
@Marmiz I don't think I understand isn't there a simple method like a control c for copy or what not to paste in chat for someone to review the code to see what I am doing wrong
Roxroy
@roxroy
Mar 21 2017 03:14
@dannywelstad , use the trim() function to remove the extra spaces
Danny Welstad
@GoonTwo
Mar 21 2017 03:14
@roxroy ok thanks!
CamperBot
@camperbot
Mar 21 2017 03:14
dannywelstad sends brownie points to @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 422 | @roxroy |http://www.freecodecamp.com/roxroy
LeSean Johnson
@leseanbiz
Mar 21 2017 03:15
@ajithvallabai i just went to the site you recommended and copied the code for a nav bar and it was broken, i think maybe im not connecting to bootstrap.
?
Ajith
@ajithvallabai
Mar 21 2017 03:16
@leseanbiz ya right i too checked it
LeSean Johnson
@leseanbiz
Mar 21 2017 03:16
so, its not just me?
Claudio Restifo
@Marmiz
Mar 21 2017 03:17
@ChristopherBurkett ies you copy it... but better format it to make it look decent and readable:
I am Formatted
Danny Welstad
@GoonTwo
Mar 21 2017 03:17
@Marmiz
function wordsToSentence(words) {
  var sentence = '';
  for (var i = 0; i < words.length; i++) {
    sentence = sentence + words[i] + ' ';
  }
  sentence.trim();
  return sentence;
}
Amit Patel
@AmitP88
Mar 21 2017 03:17
hey guys, do you think it's become harder than ever to get internships in web dev? almost every job ad I see requires someone who has or is pursuing a CS or tech degree
__mifflin__
@cdrainxv
Mar 21 2017 03:17
@dannywelstad: return sentence.trim();
Danny Welstad
@GoonTwo
Mar 21 2017 03:17
@Marmiz see anything wrong?
Ajith
@ajithvallabai
Mar 21 2017 03:18
@leseanbiz i googled it. told me that we need to import bootstrap.js
Claudio Restifo
@Marmiz
Mar 21 2017 03:18

yep!

@dannywelstad: return sentence.trim();

:wave: @cdrainxv

LeSean Johnson
@leseanbiz
Mar 21 2017 03:18
weird, ive been googling for half an hour lol
into codeine, you mean?
Danny Welstad
@GoonTwo
Mar 21 2017 03:18
@Marmiz Woot Woot! Thanks!
CamperBot
@camperbot
Mar 21 2017 03:18
:cookie: 751 | @marmiz |http://www.freecodecamp.com/marmiz
dannywelstad sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
LeSean Johnson
@leseanbiz
Mar 21 2017 03:18
codepen*
__mifflin__
@cdrainxv
Mar 21 2017 03:18
@Marmiz: Hi!
Claudio Restifo
@Marmiz
Mar 21 2017 03:19
@dannywelstad next time to test function use tihis:
https://repl.it/languages/javascript
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:19
Hi
Hows it going ever one
LeSean Johnson
@leseanbiz
Mar 21 2017 03:20
@ajithvallabai i went into the settinsg and added bootstrap t o the js tab, nothing, you?
ok, you the undetected?
SirrEric
@SirrEric
Mar 21 2017 03:21
<button type"submit">submit </button> </form> Your submit button should have the attribute type set to submit? what did i do wrong?
LeSean Johnson
@leseanbiz
Mar 21 2017 03:21
=
missing =
Ajith
@ajithvallabai
Mar 21 2017 03:21
ya i too tried did you try in your browser @leseanbiz
SirrEric
@SirrEric
Mar 21 2017 03:21
ohhh
lol
thanks
LeSean Johnson
@leseanbiz
Mar 21 2017 03:23
will do
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:24
Yo
Claudio Restifo
@Marmiz
Mar 21 2017 03:24
@leseanbiz have you added bootstap.js into JS (just checking)
LeSean Johnson
@leseanbiz
Mar 21 2017 03:24
on codepen, yes
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:24
Im anaymoos
Ajith
@ajithvallabai
Mar 21 2017 03:24
isuus.PNG
@leseanbiz
Allen
@Dash0665
Mar 21 2017 03:24
How do I make my nav bar when its not collapsed float: left/be on left side
LeSean Johnson
@leseanbiz
Mar 21 2017 03:25
wtff…
Claudio Restifo
@Marmiz
Mar 21 2017 03:25
@leseanbiz can you link the codepen?
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:25
Wtf is that
KeyWiz101
@KeyWiz101
Mar 21 2017 03:25
Is it necessary to make a new { } for class i wanna make? For instnace, h2 and p have to be in 2 different { } in order to set that class for each element?
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:25
Seem legit
Lol
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:25
Really the pics
Allen
@Dash0665
Mar 21 2017 03:26
How do I make my nav bar when its not collapsed float: left/be on left side
http://codepen.io/OrangeDASH/pen/mWwdOL?editors=1100
Sandip Shrestha
@saninmersion
Mar 21 2017 03:27
@Dash0665 you mean right?
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:28
Plz no run pen
Allen
@Dash0665
Mar 21 2017 03:28
@saninmersion yes sorry
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:28
No
Lol
So hows life
Guys
Hello any one here
Im leaving
Allen
@Dash0665
Mar 21 2017 03:29
trying to figure this out
Sandip Shrestha
@saninmersion
Mar 21 2017 03:29
@Dash0665 switch to bootstrap 3.7 its will be much easier and use nav-right
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:29
What out
Are you a fast typer?
LeSean Johnson
@leseanbiz
Mar 21 2017 03:30
should i be using a different version of bootstrap?
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:30
Really
LeSean Johnson
@leseanbiz
Mar 21 2017 03:30
is 4 not quite ready?
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:30
Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:30
Bruh
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:30
pls suggest on this challenge
Allen
@Dash0665
Mar 21 2017 03:30
@saninmersion im a little new, what link is that?
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:30
Im going to bed its 1:30 in the morning
Bye
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:30
<div class="row"> <button class="col-xs-4" "btn btn-block btn-primary">Like</button>
<button class="col-xs-4" "btn btn-block btn-info">Info</button>
<button class="col-xs-4" "btn btn-block btn-danger">Delete</button>
<p>Things cats love:</p></div>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
Sandip Shrestha
@saninmersion
Mar 21 2017 03:31
@leseanbiz yes it's quite not ready yet
LeSean Johnson
@leseanbiz
Mar 21 2017 03:31
ok, any recommendation on what version is most pervasive and stable?
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:31
Anyone?
Sandip Shrestha
@saninmersion
Mar 21 2017 03:31
the last stable is @kashutosh845 bootstrap 3.3.7
Allen
@Dash0665
Mar 21 2017 03:31
@saninmersion thank you
CamperBot
@camperbot
Mar 21 2017 03:31
dash0665 sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:cookie: 387 | @saninmersion |http://www.freecodecamp.com/saninmersion
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:31
Why are you people posting random websites
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:32
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:32
What speak english
LeSean Johnson
@leseanbiz
Mar 21 2017 03:32
@saninmersion Thanks!
CamperBot
@camperbot
Mar 21 2017 03:32
leseanbiz sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:cookie: 388 | @saninmersion |http://www.freecodecamp.com/saninmersion
Sandip Shrestha
@saninmersion
Mar 21 2017 03:32
@kashutosh845 you are supposed to nest buttons in a div each and give that the class col-xs-4 not to the button itself
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:32
Fuck this im done
Sandip Shrestha
@saninmersion
Mar 21 2017 03:33
@Theundetectedcoder those links are cdn for frameworks
Theundetectedcoder
@Theundetectedcoder
Mar 21 2017 03:33
I dont want to code any more
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:33
so i should create one more div class after row
Sandip Shrestha
@saninmersion
Mar 21 2017 03:33
@kashutosh845 yes one around each button
Ashutosh Kumar
@kashutosh845
Mar 21 2017 03:34
<div class="row"> after that
Ajith
@ajithvallabai
Mar 21 2017 03:34
@leseanbiz this was my editor code and it works in chrome
<!DOCTYPE html>
<html lang="en">
<head>

  <title>
    YES or NO
    </title>

    <!-- Bootstrap link-->
       <meta charset="utf-8"> 
       <meta name="viewport" content="width=device-width">

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




 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>



</head>

<body>
<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
    </div>

    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li class="divider"></li>
            <li><a href="#">Separated link</a></li>
            <li class="divider"></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>
      <form class="navbar-form navbar-left" role="search">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Search">
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Link</a></li>
      </ul>
    </div>
  </div>
</nav>


</body>
Sandip Shrestha
@saninmersion
Mar 21 2017 03:34
@Theundetectedcoder maybe it's not for you. Not everybody has superpower
LeSean Johnson
@leseanbiz
Mar 21 2017 03:35
@ajithvallabai @Marmiz @saninmersion Thank you guys, it still looks like ass but it was what versions of bootstrap codepen defaults to
CamperBot
@camperbot
Mar 21 2017 03:35
leseanbiz sends brownie points to @ajithvallabai and @marmiz and @saninmersion :sparkles: :thumbsup: :sparkles:
:warning: leseanbiz already gave saninmersion points
:cookie: 752 | @marmiz |http://www.freecodecamp.com/marmiz
:cookie: 325 | @ajithvallabai |http://www.freecodecamp.com/ajithvallabai
LeSean Johnson
@leseanbiz
Mar 21 2017 03:35
since oi switched each css and js in codepen to 3.3.7 it seems to be better
Allen
@Dash0665
Mar 21 2017 03:36
@saninmersion where do I put nav-right?
Sandip Shrestha
@saninmersion
Mar 21 2017 03:36
@leseanbiz :+1: Most of the online stuff on bootstrap is prior v4 and since v4 is kind of a remake. it's really a fuss to work with yet
@Dash0665 on the div that surrounds the <ul> </ul> I think . Check the bootstrap site to confirm
LeSean Johnson
@leseanbiz
Mar 21 2017 03:37
yeah, i assumed things were standardized pretty well betweene versions since they dafault to it….
Allen
@Dash0665
Mar 21 2017 03:37
@saninmersion okay thank you
CamperBot
@camperbot
Mar 21 2017 03:37
dash0665 sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:warning: dash0665 already gave saninmersion points
LeSean Johnson
@leseanbiz
Mar 21 2017 03:38
spent a damn hour on that, now i gotta take a breather and start all over
Sandip Shrestha
@saninmersion
Mar 21 2017 03:39
@leseanbiz good luck
LeSean Johnson
@leseanbiz
Mar 21 2017 03:40
do other further along actually use codeine or do youhave a template setup and just work in an ide?
codepen*
Ajith
@ajithvallabai
Mar 21 2017 03:41
@leseanbiz now it works the problem was with reference links . http://codepen.io/indian46/pen/GWQPOE?editors=1100
LeSean Johnson
@leseanbiz
Mar 21 2017 03:41
yeah, you mean to bootstrap and bootstraps?
Ajith
@ajithvallabai
Mar 21 2017 03:42
ya :smile:
nouralaura
@nouralaura
Mar 21 2017 03:42
Hey, I'm on the challenge: "Use a CSS class to style an element". I don't know what I did wrong:
Sandip Shrestha
@saninmersion
Mar 21 2017 03:42
@leseanbiz Am still on the intermediate projects so I would know. am still using codepen
LeSean Johnson
@leseanbiz
Mar 21 2017 03:42
i changed both css and js to what this gives and it worked
nouralaura
@nouralaura
Mar 21 2017 03:42

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

<h2>CatPhotoApp</h2>

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

Sandip Shrestha
@saninmersion
Mar 21 2017 03:42
@nouralaura it's supposed to be red-text I think
LeSean Johnson
@leseanbiz
Mar 21 2017 03:42
just ridiculous all of that for a simpel setting
makes me feel better lol
nouralaura
@nouralaura
Mar 21 2017 03:42
Im supposed to give h2 element the class attribute with a value of red text
help pls :)
LeSean Johnson
@leseanbiz
Mar 21 2017 03:43
<h2 class=
>
Sandip Shrestha
@saninmersion
Mar 21 2017 03:43
@nouralaura
  1. you are making a class "blue-text" not red-text in the css
  2. You got to apply that class to the <h2> like <h2 class="class-name">
Read the description and example on the left thoroughly for more detailed
Honour Moore
@honourzxc
Mar 21 2017 03:53
<a href="#"> <img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>
aphilion
@aphilion
Mar 21 2017 03:54
how do you nest your text input element within a form
<input type="text" placeholder="cat photo URL">
Honour Moore
@honourzxc
Mar 21 2017 03:55
how do i nest the img element within an a element
LeSean Johnson
@leseanbiz
Mar 21 2017 03:56
@honourzxc i think that should work
you have an omg element inside of an anchor element
img lol*
Roxroy
@roxroy
Mar 21 2017 03:57

@aphilion , wrap them into a form tag. eg

<form>    
    .. inputs goes here 
  </form>  
`

don't for get to include the attributes for the form tag.. I left it our in my example

ManBearPigg
@ManBearPigg
Mar 21 2017 03:57
If anyone needs help, just PM me
Honour Moore
@honourzxc
Mar 21 2017 03:59
its asking for me to nest it in the a element and i did but i coulndt tell if i did it correctly
couldn't
@ManBearPigg can you give me a example of how i could nest a existing img element within an anchor element?
ManBearPigg
@ManBearPigg
Mar 21 2017 04:00
yes
Honour Moore
@honourzxc
Mar 21 2017 04:01
thanks
ManBearPigg
@ManBearPigg
Mar 21 2017 04:01
  <a href="http://www.leafie.io/home"><img id="green-leaf" src="/images/about/green-leaf.png" /></a>
aphilion
@aphilion
Mar 21 2017 04:02

@roxroy <form>

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

SirrEric
@SirrEric
Mar 21 2017 04:02

'''

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

CamperBot
@camperbot
Mar 21 2017 04:02
:bulb: to format code use backticks! ``` more info
ruslan pilat
@ruslanpilat
Mar 21 2017 04:02
hey, I need to use the css style element to turn my text red. Can someone help me with that?
LeSean Johnson
@leseanbiz
Mar 21 2017 04:03
@SirrEric the backtick is on the tilde key
aphilion
@aphilion
Mar 21 2017 04:03
var code = "formatted";
SirrEric
@SirrEric
Mar 21 2017 04:04
@leseanbiz found it
Manish Giri
@Manish-Giri
Mar 21 2017 04:05
@ruslanpilat post your code
Rasel Ahmed
@mahin1234
Mar 21 2017 04:05
Hello guys can someone help me with resizing images
ruslan pilat
@ruslanpilat
Mar 21 2017 04:05
<style>
h2 class= "red-text"{
color: red;
}
</style>
Sandip Shrestha
@saninmersion
Mar 21 2017 04:07
@ruslanpilat its like this
.classname{
    css rule;
}
@mahin1234 post your code
Roxroy
@roxroy
Mar 21 2017 04:07
@aphilion , couple things
  1. you need to close the input tag,
  2. action="/submit-cat-photo" goes in the form tag
Ricardo Martinez
@rmartinez818
Mar 21 2017 04:08
Uncomment your h1, h2 and p elements.
Sandip Shrestha
@saninmersion
Mar 21 2017 04:08
@SirrEric your styling need to be inside <style> </style>
Ricardo Martinez
@rmartinez818
Mar 21 2017 04:08
I stuck here can any one help me.Uncomment your h1, h2 and p elements.
SirrEric
@SirrEric
Mar 21 2017 04:08
@saninmersion kk thanks
CamperBot
@camperbot
Mar 21 2017 04:08
sirreric sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:cookie: 389 | @saninmersion |http://www.freecodecamp.com/saninmersion
Sandip Shrestha
@saninmersion
Mar 21 2017 04:10
@rmartinez818 comments are inside <!--- ---> in html. You need to remove them to uncomment. Not everything just these comment tags
Rasel Ahmed
@mahin1234
Mar 21 2017 04:11

<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 src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

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

need to resize the img
Ricardo Martinez
@rmartinez818
Mar 21 2017 04:11
Thank you @saninmersion
CamperBot
@camperbot
Mar 21 2017 04:11
rmartinez818 sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:cookie: 390 | @saninmersion |http://www.freecodecamp.com/saninmersion
Rasel Ahmed
@mahin1234
Mar 21 2017 04:12
@saninmersion if you wanna help
Sandip Shrestha
@saninmersion
Mar 21 2017 04:13
@mahin1234 follow the example and the instructions and make a class smaller-image in <style></style> and then apply it to your <img> element. it's kind of similar to what you did with red-text
Honour Moore
@honourzxc
Mar 21 2017 04:14
okay so how do i make my ul element have colored text, for example i put in <ul> class="red-text" > < il>"blah blah"</il></ul>
Rasel Ahmed
@mahin1234
Mar 21 2017 04:15
@saninmersion how do i apply it to my img element
Sandip Shrestha
@saninmersion
Mar 21 2017 04:15

@honourzxc for any elements

<element class = "class-name" > </element>
you are putting your class attribute wrong

Rasel Ahmed
@mahin1234
Mar 21 2017 04:16
"src" kind of confused me on where to put the "class="
Honour Moore
@honourzxc
Mar 21 2017 04:16
@mahin1234 .smaller-image {
width: 100px;
}
is that what you were talking about?
Sandip Shrestha
@saninmersion
Mar 21 2017 04:16
@mahin1234 same as you applied "red-text" to <h2> or <p>
<img class="class-name">
Anavel
@arivera165
Mar 21 2017 04:16
i’m trying to put a border around this image but it’s not working
Sandip Shrestha
@saninmersion
Mar 21 2017 04:16
@honourzxc we are not supposed to hand out solution codes
Anavel
@arivera165
Mar 21 2017 04:16
.thick-black-border { border-color: black;
border-width: 5px;
border-style: solid; }
Honour Moore
@honourzxc
Mar 21 2017 04:16
@saninmersion ahhh shit your right, thx man
CamperBot
@camperbot
Mar 21 2017 04:16
honourzxc sends brownie points to @saninmersion :sparkles: :thumbsup: :sparkles:
:cookie: 391 | @saninmersion |http://www.freecodecamp.com/saninmersion
Anavel
@arivera165
Mar 21 2017 04:17
<img class:"smaller-image thick-black-border img" src="http://static.stereogum.com/uploads/2015/01/Thom-Yorke.jpg" alt="Thom Yorke" >
LeSean Johnson
@leseanbiz
Mar 21 2017 04:17
isnt there a bootstrap class for img-border or something?
Manish Giri
@Manish-Giri
Mar 21 2017 04:17
@mahin1234 you can specify multiple attributes to an HTML element
<img id="..." class="..." src="..." alt="...">
Anavel
@arivera165
Mar 21 2017 04:17
?am i doing something wrong
Rasel Ahmed
@mahin1234
Mar 21 2017 04:17
oh i got it
Thank you!
Manish Giri
@Manish-Giri
Mar 21 2017 04:17
@arivera165 the URL should be the one they specify
on the left..
Sandip Shrestha
@saninmersion
Mar 21 2017 04:17
@arivera165 is it a challenge?
Manish Giri
@Manish-Giri
Mar 21 2017 04:17
@arivera165 class:"
also, =
not :
Anavel
@arivera165
Mar 21 2017 04:18
yeah it’s the first one
ah!
i do that a lot
thanks @Manish-Giri
CamperBot
@camperbot
Mar 21 2017 04:18
arivera165 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 4862 | @manish-giri |http://www.freecodecamp.com/manish-giri
JJ
@jjlmn
Mar 21 2017 04:21

Hello guys, i'm stuck on that :

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

Can anyone help?? many thanks

Manish Giri
@Manish-Giri
Mar 21 2017 04:21
@arivera165 :+1:
Sandip Shrestha
@saninmersion
Mar 21 2017 04:22
@jjlmn your code
Edward John
@eddmecha
Mar 21 2017 04:23
hi guys
Sterrio9
@Sterrio9
Mar 21 2017 04:23

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

Edward John
@eddmecha
Mar 21 2017 04:23
i need advice
Sterrio9
@Sterrio9
Mar 21 2017 04:23
I need help on adding a second p value
Honour Moore
@honourzxc
Mar 21 2017 04:23
browser text zoom is just a side note, if you look up at your tab, you should see 3 dots to the far right, click on that and there should be a section titled textzoom
@eddmecha
Edward John
@eddmecha
Mar 21 2017 04:24
@honourzxc yes?
Honour Moore
@honourzxc
Mar 21 2017 04:24
@jjlmn
sorry wrong person @eddmecha
Qwassi
@Qwassi
Mar 21 2017 04:24
@jjlmn
Edward John
@eddmecha
Mar 21 2017 04:24
i am stuck at creating a pink-text on h1 element

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

}
</style>

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

LeSean Johnson
@leseanbiz
Mar 21 2017 04:24
i think lorem ipsum text should be replaced with repeated lyrics of the fresh prince
Honour Moore
@honourzxc
Mar 21 2017 04:25
h2 {
font-family: Lobster, Monospace;
}
this is just a exspample of the simple version, did you forget to lable your style? @eddmecha
Qwassi
@Qwassi
Mar 21 2017 04:26
@jjlmn put font-size: 16px; inside the css style.
Sandip Shrestha
@saninmersion
Mar 21 2017 04:26
@Sterrio9 just use <p> </p> more than one of them can be used
Daniel Simeonov
@dbsimeonov
Mar 21 2017 04:27

Guys I'm stuck <<<< Seriously please someone if its possible to help me
.smaller-image{
width:500px;
}

How to insert it in my img src ?

Honour Moore
@honourzxc
Mar 21 2017 04:27
@leseanbiz yes haha
Sandip Shrestha
@saninmersion
Mar 21 2017 04:27
@eddmecha I think you are supposed to style the <h1> with css rule color: pink;
@dbsimeonov like you did red-text to <p> .
<img class="class-name">
Edward John
@eddmecha
Mar 21 2017 04:28
@saninmersion i see let me try
Qwassi
@Qwassi
Mar 21 2017 04:28
@dbsimeonov Inside the img tag, just type in class="smaller-image".
Tina Yarbrough
@Yarbie
Mar 21 2017 04:28
@eddmecha .pink-text {color:pink;} within style
Honour Moore
@honourzxc
Mar 21 2017 04:29
@dbsimeonov well you dont put in your image you refrence it with you <p> or the <h1> example

p {
}

.smaller-image {
width: 500px;

Daniel Simeonov
@dbsimeonov
Mar 21 2017 04:30
Thanks, and @Browser zoom should be at 100%."
CamperBot
@camperbot
Mar 21 2017 04:30
:warning: @browser's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
dbsimeonov sends brownie points to @browser :sparkles: :thumbsup: :sparkles:
Sandip Shrestha
@saninmersion
Mar 21 2017 04:31
@dbsimeonov browser zoom is a safety measure. never have I seen anyone had trouble with that.
Daniel Simeonov
@dbsimeonov
Mar 21 2017 04:31
The bad was mine. sorry. Thanks for the help :)
ruslan pilat
@ruslanpilat
Mar 21 2017 04:31
<style>
.red-text {
color: red;
}
</style>
can someone explain why its not working
Qwassi
@Qwassi
Mar 21 2017 04:33
@ruslanpilat What are you trying to do? Can you give the html tag below the style tag?
ruslan pilat
@ruslanpilat
Mar 21 2017 04:33

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

<h2>CatPhotoApp</h2>

i need to make it red
Sandip Shrestha
@saninmersion
Mar 21 2017 04:34
@ruslanpilat you gotta apply the class to <h2> element is not it?
Qwassi
@Qwassi
Mar 21 2017 04:34
@ruslanpilat The CSS in the style tag is fine . Just declare the class red-text inside the h2 tag
ruslan pilat
@ruslanpilat
Mar 21 2017 04:34
how do i do that
Qwassi
@Qwassi
Mar 21 2017 04:34
@ruslanpilat Like this <h2 class="red-rext">
Sandip Shrestha
@saninmersion
Mar 21 2017 04:34
@ruslanpilat
<h2 class="class-name" >
ruslan pilat
@ruslanpilat
Mar 21 2017 04:35
thanks guys @saninmersion @Qwassi
CamperBot
@camperbot
Mar 21 2017 04:35
ruslanpilat sends brownie points to @saninmersion and @qwassi :sparkles: :thumbsup: :sparkles:
:cookie: 392 | @saninmersion |http://www.freecodecamp.com/saninmersion
:cookie: 26 | @qwassi |http://www.freecodecamp.com/qwassi
LeSean Johnson
@leseanbiz
Mar 21 2017 04:35
alright guys, im done for the night, thanks!
Sandip Shrestha
@saninmersion
Mar 21 2017 04:36
@leseanbiz good night
Ashutosh Kumar
@kashutosh845
Mar 21 2017 04:39
Give the submit button in your form the classes btn btn-primary.
<button class="btn btn-primary"><input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
How to do it?
Sandip Shrestha
@saninmersion
Mar 21 2017 04:40
@kashutosh845 <button class="btn btn-primary"> is not your submit button.
this is <button type="submit">Submit</button>
Qwassi
@Qwassi
Mar 21 2017 04:41
@kashutosh845<button type="submit" class="btn btn-primary">Submit</button>
Ashutosh Kumar
@kashutosh845
Mar 21 2017 04:42
okk
thanks
talatmorshedtanbir
@talatmorshedtanbir
Mar 21 2017 04:51
hello
I'm new here
ManBearPigg
@ManBearPigg
Mar 21 2017 04:58
hi @talatmorshedtanbir
KiingRex
@KiingRex
Mar 21 2017 04:59
hey everybody i just started here, i'm stuck with one part of a challenge for creating a class called smaller-image to resize the picture
Sandip Shrestha
@saninmersion
Mar 21 2017 05:02
@KiingRex post what u tried
KiingRex
@KiingRex
Mar 21 2017 05:03
img .smaller-image {
width: 100px;
}
i'm not sure exactly how to set it to the image on the screen already
i've been stuck for half an hour lol
ManBearPigg
@ManBearPigg
Mar 21 2017 05:05
@KiingRex check your pm's dude
Qwassi
@Qwassi
Mar 21 2017 05:07
@KiingRex <img class="smaller-image">
Sandip Shrestha
@saninmersion
Mar 21 2017 05:07
@KiingRex you dont need to specify img to the class .smaller-image and you need to put the class in your <img> like <img class="class-name"> kind of like what you did with your red-text and <p>
Tasja
@natasjja
Mar 21 2017 05:14
Hello! I'm new here :)
Ashutosh Kumar
@kashutosh845
Mar 21 2017 05:16
Nest both of your div elements with the class "col-xs-6" within your div element with the class "row".
JordyJay84
@JordyJay84
Mar 21 2017 05:16
Hey guys, it's my first time doing this. I'm stuck on the challenge when I'm inserting the image of the kitten into the website. I can get the image to show up, and I'm also successful in adding the alt attribute to the image. But I'm stuck on the part of the challenge that says "your image should have a src attribute that points to the kitten image." How do I accomplish this part?
Chris Cullen
@123xylem
Mar 21 2017 05:16

My Put Request is being handled as a POST request even though im using method-override... ANy idea why?

<form action="/camps/<%=camp._id%>?_method=PUT" method="POST">

My form^^^^^^
Method overried below:

 methodOverride      =require("method-override"),

app.use(methodOverride("_method"));

Are they not linked or somethign?

Ashutosh Kumar
@kashutosh845
Mar 21 2017 05:16

<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6">
<div class="well"</div></div>

<div class="col-xs-6">
  <div class="well"</div>

</div>

</div>
</div>

isn't it a correct solution?
sorry my mistake,i got it...
Chris Cullen
@123xylem
Mar 21 2017 05:20
https://webdevlearning-clayton901.c9users.io/camps/58d0b6e20229220ab4452a2a/?_method=put
Cannot POST /camps/58d0b6e20229220ab4452a2a/
Getting this error from above query
h1tag
@h1tag
Mar 21 2017 05:50
@kashutosh845 make sure all your div tags have a closing tag
@JordyJay84 can I see your img element code?
Edward John
@eddmecha
Mar 21 2017 05:53
guys what does this means?Make sure you have nested all HTML elements in .container-fluid.

<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" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>

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

Coy Sanders
@coymeetsworld
Mar 21 2017 05:54
Means you want a div with that class surrounding all your other HTML code
except the style and link tags
Edward John
@eddmecha
Mar 21 2017 05:54
ahh i see
Ai rui 艾瑞
@aisolae
Mar 21 2017 05:56
$(".target:nth-child(1)").click(function(event){
addClass("animated bounce");
}) ;
i am trying to add the animation bounce to the target whenever i click it
did i do anything wrong ?
Coy Sanders
@coymeetsworld
Mar 21 2017 05:58
addClass is wrong, there needs to be a jQuery selector before it
Ai rui 艾瑞
@aisolae
Mar 21 2017 06:02
$(".target:nth-child(1)")
that's the selector
Coy Sanders
@coymeetsworld
Mar 21 2017 06:03
addClass needs a selector, check the documentation I linked
Ai rui 艾瑞
@aisolae
Mar 21 2017 06:04
checking it
YANGZHAO
@YANGGMM
Mar 21 2017 06:07
How to Inform with the Paragraph Element
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:19
Create a script element making sure it is valid and has a closing tag.
You should add $(document).ready(function() { to the beginning of your script element.
Close your $(document).ready(function() { function with });
how to do this?
<script>$(document).ready(function() {
});</script>
i know it's absolutely wrong...but no clue about this
pls suggest something
<script>$(document).ready(function() });</script>
Coy Sanders
@coymeetsworld
Mar 21 2017 06:24
looks right @kashutosh845, but maybe format the code a little bit. Don't have the script tags on separate lines
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:25
see above i've done it...
but got nothing
Coy Sanders
@coymeetsworld
Mar 21 2017 06:25
they're not on separate lines, maybe thats whats causing the issue
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:25
<script>$(document).ready(function() });</script>
Coy Sanders
@coymeetsworld
Mar 21 2017 06:26
that line has a typo
you're missing a curly brace
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:26
in starting
<script>$(document).ready(function() { });</script>
Coy Sanders
@coymeetsworld
Mar 21 2017 06:29
looks fine to me, but again I would suggest not putting that all on one line
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:30
<script>$(document).ready(function() {});
</script>
Coy Sanders
@coymeetsworld
Mar 21 2017 06:31
<script>
  $(document).ready(function() {
    /* All js code will go between here */
  });
</script>
like this
either way works but might as well do it this way now, you're going to be adding more code in later challenges
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:32
okk
ManBearPigg
@ManBearPigg
Mar 21 2017 06:32
instead of using document.ready
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:32
let me try
ManBearPigg
@ManBearPigg
Mar 21 2017 06:32
why dont you just put your script right before your closing body tag
that ensures that all of the html elements load first
Coy Sanders
@coymeetsworld
Mar 21 2017 06:32
@ManBearPigg its a FCC challenge
ManBearPigg
@ManBearPigg
Mar 21 2017 06:32
ah
gotcha
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:33
<script>
$(document).ready(function() {

});
</script>
nothing happened
Coy Sanders
@coymeetsworld
Mar 21 2017 06:34
try refreshing the browser
sandy1594
@sandy1594
Mar 21 2017 06:34
<p>Click here for<a href="#"> cat photos</a>.</p> whats wrong in this line?
Coy Sanders
@coymeetsworld
Mar 21 2017 06:34
@sandy1594 need a lot more information than that, what does wrong mean?
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:34
okk
Coy Sanders
@coymeetsworld
Mar 21 2017 06:35
what challenge is it? wheres the rest of your code and what are you failing on?
sandy1594
@sandy1594
Mar 21 2017 06:35
Replace the value of your a element's href attribute with a #, also known as a hash symbol, to turn it into a dead link.
29th challenge
Coy Sanders
@coymeetsworld
Mar 21 2017 06:36
theyre not numbered
the line looks ok to me
you didn't add a new one right? you edited the one you had already
sandy1594
@sandy1594
Mar 21 2017 06:37
ya
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:37
nothing happened
Coy Sanders
@coymeetsworld
Mar 21 2017 06:38
show all your code please @kashutosh845
sandy1594
@sandy1594
Mar 21 2017 06:38
it said "Replace the value of your a element's href attribute with a #, also known as a hash symbol, to turn it into a dead link."
so i just edited it
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:38
done by refreshing the browser again
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:57
<script>
$(document).ready(function() {

});
</script>
Use the jQuery addClass() function to give the classes animated and bounce to your button elements.
isn't it correct?
Coy Sanders
@coymeetsworld
Mar 21 2017 06:58
is what correct? You didn't add any code
Ashutosh Kumar
@kashutosh845
Mar 21 2017 06:58
<script>
$(document).ready(function() {
$("button").ready(addclass("animated bounce");

});
</script>
sorry 4 that
this one
is it correct?
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 07:00
.
Coy Sanders
@coymeetsworld
Mar 21 2017 07:00
theres no ready function
check the instructions again
they give examples
Ashutosh Kumar
@kashutosh845
Mar 21 2017 07:01
<script>
$(document).ready(function() {
$("button").addclass("animated bounce");

});
</script>
Manish Giri
@Manish-Giri
Mar 21 2017 07:01
@kashutosh845 uppercase C
Coy Sanders
@coymeetsworld
Mar 21 2017 07:01
@kashutosh845 don't just brute force it, look closely at instructions
Tiffany E Caldwell
@tecald
Mar 21 2017 07:02
how do i find the long url for an image instead of the short url
Coy Sanders
@coymeetsworld
Mar 21 2017 07:02
@Manish-Giri is right its not addclass, JS is case-sensitive
Ashutosh Kumar
@kashutosh845
Mar 21 2017 07:02
okk
my wrong
sorry
Manish Giri
@Manish-Giri
Mar 21 2017 07:02
@coymeetsworld new picture?
Coy Sanders
@coymeetsworld
Mar 21 2017 07:02
im changing it back lol
Manish Giri
@Manish-Giri
Mar 21 2017 07:02
lol
AbradolfLinclr
@AbradolfLinclr
Mar 21 2017 07:02
can someone help me figure the first step in Jquery
<script>
$(document).ready(function() {});
</script>
Coy Sanders
@coymeetsworld
Mar 21 2017 07:02
@tecald what image?
AbradolfLinclr
@AbradolfLinclr
Mar 21 2017 07:02
why doesnt this work?
Claudio Restifo
@Marmiz
Mar 21 2017 07:02
@tecald you probably mean the image address?
Tiffany E Caldwell
@tecald
Mar 21 2017 07:03
an image from unsplash.com
im trying to use as a background
Coy Sanders
@coymeetsworld
Mar 21 2017 07:04
try right clicking the image and select inspect element @tecald
Edgar Pan
@edgaryp
Mar 21 2017 07:04
@AbradolfLinclr where is the rest of your code?
Coy Sanders
@coymeetsworld
Mar 21 2017 07:04
you'll see the link look something like this:
<a href="/?photo=MthLYI2WLCs" title="View the photo By Ales Krivec" class="cV68d" style="background-image: url(&quot;https://images.unsplash.com/photo-1428940253195-53483a1de2e6?dpr=1&amp;auto=compress,format&amp;fit=crop&amp;w=1199&amp;h=826&amp;q=80&amp;cs=tinysrgb&amp;crop=&quot;); width: 1176px; height: 810px;"></a>
AbradolfLinclr
@AbradolfLinclr
Mar 21 2017 07:04
that is literally all i need to do on this step @edgaryp
Create a script element making sure it is valid and has a closing tag.
You should add $(document).ready(function() { to the beginning of your script element.
Close your $(document).ready(function() { function with });
Coy Sanders
@coymeetsworld
Mar 21 2017 07:04
the image url is in there, not sure if that's what you're looking for
Tiffany E Caldwell
@tecald
Mar 21 2017 07:05
ok let me try thank you
Tanikimura
@Tanikimura
Mar 21 2017 07:05
Hi ! I've just finished my portfolio . everything is ok when i run it wth the index.html on my computer but when I use github my images on img tag and fontawesome are not working !! Need some Help pls !!
Edgar Pan
@edgaryp
Mar 21 2017 07:07
@AbradolfLinclr I don't see the problem ... which challenge?
Tanikimura
@Tanikimura
Mar 21 2017 07:11
:(
Jor
@joreyesl
Mar 21 2017 07:13
@AbradolfLinclr try refreshing the page, sometimes the challenge gets bugged.
Tiffany E Caldwell
@tecald
Mar 21 2017 07:13
what is vh istead of px
instead
Tanikimura
@Tanikimura
Mar 21 2017 07:14
viewport height
Claudio Restifo
@Marmiz
Mar 21 2017 07:14

@Tanikimura make sure all the image path are 100% correct since Jekyll is case sensitive eg:

<img src="/Picture.Jpg

<img src=/picture.jpg

Are two different things.
Same goes for all your icons

Coy Sanders
@coymeetsworld
Mar 21 2017 07:14
different unit of measurement @tecald
Tiffany E Caldwell
@tecald
Mar 21 2017 07:15
okay, and used used a the decretion of the coder?
used at * sorry cant type lol tired
Coy Sanders
@coymeetsworld
Mar 21 2017 07:15
its a more adv topic and there are other measurements like em and rem too
Tiffany E Caldwell
@tecald
Mar 21 2017 07:15
ok thank you
Coy Sanders
@coymeetsworld
Mar 21 2017 07:15
think its fine to use whatever but for responsive design its better to get away from px as that is the least responsive
Tanikimura
@Tanikimura
Mar 21 2017 07:16
@Marmiz ok but for example images call in css (background-image ) are displayed well. and they are in the same folder
Tiffany E Caldwell
@tecald
Mar 21 2017 07:16
i see
Kyle's page doesn't go over vh but its still a good read
Tanikimura
@Tanikimura
Mar 21 2017 07:19
i've already try to use vh and get a better result with width : 100% and height :auto
ibaka10
@ibaka10
Mar 21 2017 07:23
Edward John
@eddmecha
Mar 21 2017 07:24
guys does this "Give the submit button in your form the classes btn btn-primary."
equals to this "<button type="btn btn-primary">Submit</button>
"
Coy Sanders
@coymeetsworld
Mar 21 2017 07:25
@eddmecha you don't change the type, that needs to be reverted. You need to add the classes along w/ the type
Edward John
@eddmecha
Mar 21 2017 07:27
oh i see
so means <button type="btn-primary">Submit</button>
right?
Coy Sanders
@coymeetsworld
Mar 21 2017 07:28
no
type doesn't change
btn-primary is a class, not a type
Edward John
@eddmecha
Mar 21 2017 07:29
ohh means i need to add class= "btn btn-primary"
Coy Sanders
@coymeetsworld
Mar 21 2017 07:30
yes, just like how you would add classes to any other element, use the class attribute
Edward John
@eddmecha
Mar 21 2017 07:31
i see i see thanks so much!!
appreciate it..
Coy Sanders
@coymeetsworld
Mar 21 2017 07:31
np
Edward John
@eddmecha
Mar 21 2017 07:31
im sorry if i asked dumb questions as i am quite new in this
hehe
Coy Sanders
@coymeetsworld
Mar 21 2017 07:31
no worries, not dumb questions
Henry
@GitHub-Henry
Mar 21 2017 07:32
OK it's late, would appreciate help getting my alert function to work, not sure why it doesn't http://codepen.io/fccHenry/pen/peavjx
Qwassi
@Qwassi
Mar 21 2017 07:37
@GitHub-Henry It's working on my end.
Henry
@GitHub-Henry
Mar 21 2017 07:38
The alert function doesn't pop up for me. It did once, but no more.
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:38
the alert says hello
Qwassi
@Qwassi
Mar 21 2017 07:39
@GitHub-Henry It will only pop up once after the page load. How many times do you want it to pop up?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:39
how can I send a hello message back to it?
Henry
@GitHub-Henry
Mar 21 2017 07:40
I assumed it would re-run the page when I clicked the Run codepen button, am I incorrect, not sure.
When I click run the page drops, then springs back (that's the removeClass at work) then I expect an alert, but I don't get one
Qwassi
@Qwassi
Mar 21 2017 07:41
@alexanderkopke We cannot send any message back to javascript alert message. It is only for the website to communicate with the user, not the other way around.
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:41
:(
Qwassi
@Qwassi
Mar 21 2017 07:43
@GitHub-Henry Hmmm... that's weird. I get it every time I rerun the codepen. By the way, I am using Firefox 52.0.1.
Ashutosh Kumar
@kashutosh845
Mar 21 2017 07:43
Emphasize the text in your target4 button by adding HTML tags.
Make sure the text is otherwise unchanged.
<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target4").html("<em>jQueryPlayground</em>");

});
</script>
this is all i have to do no?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:45
@GitHub-Henry how do you get a run button if it is your own pen?
@kashutosh845 almost.. The text of target4 id should stay the same. Look at target4 id element and see what text is
Claudio Restifo
@Marmiz
Mar 21 2017 07:45
@GitHub-Henry you sure you didn't click "prevent this message to show again"?
Henry
@GitHub-Henry
Mar 21 2017 07:46
Qwassi
@Qwassi
Mar 21 2017 07:47
@alexanderkopke You can try the run shortcut by pressing ctrl+shift+5.
Henry
@GitHub-Henry
Mar 21 2017 07:47
Do you guys see what I mean?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:47
cool thanks @Qwassi
CamperBot
@camperbot
Mar 21 2017 07:47
:cookie: 27 | @qwassi |http://www.freecodecamp.com/qwassi
alexanderkopke sends brownie points to @qwassi :sparkles: :thumbsup: :sparkles:
Edward John
@eddmecha
Mar 21 2017 07:47
guys how do i apply bootstrap text-center?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:48
class="text-center"
Henry
@GitHub-Henry
Mar 21 2017 07:48
I'm thinking on element that has text for inner HTML like H1 or p class="text-center"
Edward John
@eddmecha
Mar 21 2017 07:49
@haydennorthcott thanks for the link
CamperBot
@camperbot
Mar 21 2017 07:49
eddmecha sends brownie points to @haydennorthcott :sparkles: :thumbsup: :sparkles:
:warning: @haydennorthcott's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
Henry
@GitHub-Henry
Mar 21 2017 07:50
So, are you guys saying that when you run my code, an alert shows up?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:50
@GitHub-Henry what if you close the window or tab with your codepen and then open it again?
m0llycat
@m0llycat
Mar 21 2017 07:50
Hi, I'm stuck on adding a alt attribute could someone help?
Qwassi
@Qwassi
Mar 21 2017 07:50
@GitHub-Henry Yes, I understand what you meant. But the alert pops up just fine on my browser. I think you may have accidentally pressed "don't show pop up from this page again" when the alert popped up for the first time. Just like @Marmiz mentioned.
@m0llycat You mean adding alt to img tag?
m0llycat
@m0llycat
Mar 21 2017 07:51
Yh
Qwassi
@Qwassi
Mar 21 2017 07:51
@m0llycat What's the problem?
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:51
<element alt="some text or something">
Henry
@GitHub-Henry
Mar 21 2017 07:51
That was the answer, close my tab, and reopen it
Thanks
It works
m0llycat
@m0llycat
Mar 21 2017 07:52
I've got the image but not what I need to do for the alt
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:53
<img src="someUrl" alt="something here">
Rajan
@codistro
Mar 21 2017 07:53
@codistro
which are the best language for backend in web development as a begineer
?
Qwassi
@Qwassi
Mar 21 2017 07:54
@m0llycat The text in the alt will only be displayed if the image is not available.
@m0llycat Try give the wrong url to the image. I bet you will see the alt text.
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:54
php seems pretty straight forward for backend.
m0llycat
@m0llycat
Mar 21 2017 07:54
Thanks
I didn't add the alt=
Alexander Køpke
@alexanderkopke
Mar 21 2017 07:56
Muhammad Hasham
@MohammadHasham
Mar 21 2017 07:58
which operating system is better to use for web developers
windows,Mac OS or linux ?
Chris
@christosmiz10
Mar 21 2017 07:59
Hi all!! i am new here so any help appreciate it !! i am at t he section "add images to your Website" the thing is that is not letting me to proceed although the source code is correct because i testes it with notepad++
Qwassi
@Qwassi
Mar 21 2017 08:00
@christosmiz10 Can you show your code?
Chris
@christosmiz10
Mar 21 2017 08:00
yes sure thanks
Tanikimura
@Tanikimura
Mar 21 2017 08:00
I dont uderstand why with github images in img tag and font awesome don't work !! when i call images in css its alright and images are in the same folder !!
Chris
@christosmiz10
Mar 21 2017 08:00

<a href="https://s3.amazonaws.com/freecodecamp/relaxing-cat.jpg">
<img src="https://s3.amazonaws.com/freecodecamp/relaxing-cat.jpg"

alt="nice kitty !.">
</a>

Qwassi
@Qwassi
Mar 21 2017 08:01
@MohammadHasham In general, it doesn't really matter. But if you are going to develop using Ruby on Rails, I guess Mac and linux is better than Windows. That's what I heard before. Maybe things have changed.
Muhammad Hasham
@MohammadHasham
Mar 21 2017 08:02
@Qwassi Thanks.
CamperBot
@camperbot
Mar 21 2017 08:02
mohammadhasham sends brownie points to @qwassi :sparkles: :thumbsup: :sparkles:
:cookie: 28 | @qwassi |http://www.freecodecamp.com/qwassi
Qwassi
@Qwassi
Mar 21 2017 08:03
@christosmiz10 You html seems to be fine. What are the requirements to pass the challenge?
Your*
Chris
@christosmiz10
Mar 21 2017 08:07
Your image should have a src attribute that points to the kitten image. and is red !!
Qwassi
@Qwassi
Mar 21 2017 08:07
@christosmiz10 You must use the given url. This one <img src="https://bit.ly/fcc-relaxing-cat" alt="cat">
I just tested it and it worked.
Chris
@christosmiz10
Mar 21 2017 08:14
yes it worked just fine thanks for your prompt reply !
Qwassi
@Qwassi
Mar 21 2017 08:14
@christosmiz10 No problem.
Alexander Køpke
@alexanderkopke
Mar 21 2017 08:15
   🔺
 🔺 🔺
dang
Zhan Hui
@evanzhoe
Mar 21 2017 08:16
hi, how do I create a Tweet button for users to tweet random quotes on codepen?
Lance
@texass2010
Mar 21 2017 08:18
@E-Mech You can just create a button and in JS just take the info of quote and then send to tweet link.
Zhan Hui
@evanzhoe
Mar 21 2017 08:19
@azaraliyev any specific function in JS that I could google?
Lance
@texass2010
Mar 21 2017 08:20
For each quote set a data attr and then on click action just take that and send to http://twitter.com/share?text=text
It is just a regular $('#share').on('click', function() { code goes here })
Claudio Restifo
@Marmiz
Mar 21 2017 08:21
@E-Mech Twitter has a great doc for that:
https://dev.twitter.com/web/tweet-button
Lance
@texass2010
Mar 21 2017 08:21
in html you can create a <button id='share'>Share</button>
@E-Mech check the url @Marmiz has shared
Zhan Hui
@evanzhoe
Mar 21 2017 08:23

<a class="twitter-share-button"
href="https://twitter.com/intent/tweet?text=Hello%20world”>

is this the part to modify? —> text=Hello%20world

Lance
@texass2010
Mar 21 2017 08:24
@E-Mech yes
just replace text=yourcontent
and dont forget to convert string to url friendly
Zhan Hui
@evanzhoe
Mar 21 2017 08:25
@azaraliyev @Marmiz Thanks! I’ll try it again
CamperBot
@camperbot
Mar 21 2017 08:25
e-mech sends brownie points to @azaraliyev and @marmiz :sparkles: :thumbsup: :sparkles:
:cookie: 433 | @azaraliyev |http://www.freecodecamp.com/azaraliyev
:cookie: 753 | @marmiz |http://www.freecodecamp.com/marmiz
Zhan Hui
@evanzhoe
Mar 21 2017 08:26
Do I have to use this:
Customize Tweet button parameters using data-* attributes.
seems complicated and I don’t understand the purpose
Lance
@texass2010
Mar 21 2017 08:26
@E-Mech use encodeURIComponent to encode strings
Zhan Hui
@evanzhoe
Mar 21 2017 08:27
may I ask what is that?
Lance
@texass2010
Mar 21 2017 08:27
like you cant take "share me" and send via URL, but using encodeURIComponent you can convert "share me" to "share%20me"
so it becomes url friendly so to speak
@E-Mech imagine you need to enter this in url "Whatever the mind of man can conceive and believe, it can achieve."
Zhan Hui
@evanzhoe
Mar 21 2017 08:28
is there a tutorial on this?
so overwhelmed right now
totally off the freecodecamp tutorials track
Lance
@texass2010
Mar 21 2017 08:29
encodeURIComponent("Whatever the mind of man can conceive and believe, it can achieve") becomes Whatever%20the%20mind%20of%20man%20can%20conceive%20and%20believe%2C%20it%20can%20achieve
Edward John
@eddmecha
Mar 21 2017 08:29
guys can help me check where did i done wrong in this code?
the task was "Target the element with the id target3 and use the jQuery addClass() function to give it the class fadeOut.
Lance
@texass2010
Mar 21 2017 08:29
@E-Mech just take it slow.
Edward John
@eddmecha
Mar 21 2017 08:29
and i wrote "$("#target3").addClass("animated FadeOut");
"
Lance
@texass2010
Mar 21 2017 08:30
You can first create a button and then share the string as it is, then explore encodeURIComponent
Sandip Shrestha
@saninmersion
Mar 21 2017 08:30
@eddmecha fadeOut not FadeOut
Zhan Hui
@evanzhoe
Mar 21 2017 08:31
@azaraliyev will do! I’m going through Youtube videos on this
Edward John
@eddmecha
Mar 21 2017 08:31
@saninmersion ohh how silly me
Lance
@texass2010
Mar 21 2017 08:31
@eddmecha Js always prefers cammelCase
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:31
hi all, anyone that can help me with an algorithm challenge
Title Case a Sentence
Lance
@texass2010
Mar 21 2017 08:32
but I start liking kebab case
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:32

function titleCase(str) {
return str;
}

titleCase("I'm a little tea pot");

string.prototype.replaceAt = function(index, character) {
return this.substr(0, index) + character + this.substr(index+character.length);
};

function titleCase(str) {
var newTitle = str.split(' ');
var updatedTitle = [];
for (var st in newTitle) {
updatedTitle[st] = newTitle[st].toLowerCase().replaceAt(0, newTitle[st].charAt(0).toUpperCase());
} //error in this line i think
return updatedTitle.join(' ');
}

Lance
@texass2010
Mar 21 2017 08:33
@mcvdt07 you just need to take first letter and make it uppercase then all the others lowercase.
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:33
@azaraliyev titleCase("sHoRt AnD sToUt") should return "Short And Stout".
Lance
@texass2010
Mar 21 2017 08:33
string[0] is first, and then from second letter to the end to convert it to lower
@mcvdt07 oh sorry, I mistaken this to other one
let me see
@mcvdt07 first convert string to array str.split(' ')
then go through each word
from there it should be easy
dont forger to join the array at the end and return the end string
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:36
@azaraliyev missing semi colon array;string.plit(' ');
?
Lance
@texass2010
Mar 21 2017 08:36
noo I mean
var words = str.split(' ');
should give you all the words
then loop through words array
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:41

@azaraliyev
function titleCase(str) {
return str;
}

titleCase("I'm a little tea pot");

string.prototype.replaceAt = function(index, character) {
return this.substr(0, index) + character + this.substr(index+character.length);
};

function titleCase(str) {
var words = str.split(' ');//sugested line
var newTitle = str.split(' ');
var updatedTitle = [];
for (var st in newTitle) {
updatedTitle[st] = newTitle[st].toLowerCase().replaceAt(0, newTitle[st].charAt(0).toUpperCase());
} //error in this line i think
return updatedTitle.join(' ');
}

Zhan Hui
@evanzhoe
Mar 21 2017 08:41

@azaraliyev is there a way to retrieve the String in javascript and use it in the HTML code?
JS:
var forShareQuote = randQuote;
forShareQuote.replace(/\s/g,"+");
}

HTML:
<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=forShareQuote" target="_blank">
Tweet</a>

Lance
@texass2010
Mar 21 2017 08:41
@mcvdt07 you are thinking too complex.
anil
@anilt104
Mar 21 2017 08:41

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

<style>

cat-photo-form {

background-color:green;
}
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

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

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

.smaller-image {
width: 100px;
}

.silver-background {
background-color: silver;
}
</style>

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

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

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

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

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

strucked with i'd attributes
whats wrong with code
Lance
@texass2010
Mar 21 2017 08:42
just think, first you get all the words from string to array then loop through and modify each word in array, like first letter to uppercase and the others lowercase, and the end just join the array and return the string.
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:42
@azaraliyev if i replace var newTitle = str.split(' '); with var words = str.split(' '); it still needs to split the newTitle newTitle = str.split(' '
Lance
@texass2010
Mar 21 2017 08:43
@mcvdt07 let me help you
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:43
@azaraliyev object orientated functional programming and basic algorithms make me pull hair out, im lucky if i do one challenge a day these days, lol
Sandip Shrestha
@saninmersion
Mar 21 2017 08:44
@mcvdt07 it's just arrays
Lance
@texass2010
Mar 21 2017 08:45
function titleCase(str) {
  var words = str.split(' ');
  var modifiedWords = words.map(function(word) {
    return word[0].toUpperCase() + word.slice(1).toLowerCase();
  });

  return modifiedWords.join(' ');
}
@mcvdt07 now dont copy. let me explain
see, first we get string to words, and we use a space in split.
then we have words like ['I', 'am', 'good']
aerir
@aerir
Mar 21 2017 08:46
Guys i'm having problem with this 'Learn how Script Tags and Document Ready Work'
Is there anything wrong with this block?
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:46
@azaraliyev this line String.prototype.split()
aerir
@aerir
Mar 21 2017 08:46
<script>
$( document ).ready(function() {
});
</script>
moiezbabar
@Moiezbabar
Mar 21 2017 08:46
I'm stuck my jquery does not work when page is load
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:46
sorry
@azaraliyev var words = str.split(' '); <--- this line?
Lance
@texass2010
Mar 21 2017 08:47
yes
str you are getting from the function titleCase(str)
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:47
@azaraliyev im happy with that
May Kittens Devour Your Soul
@diomed
Mar 21 2017 08:48
@aerir (document)
no spaces
feedmecode-01
@feedmecode-01
Mar 21 2017 08:48
how to find the pen i was working on
in codepen
May Kittens Devour Your Soul
@diomed
Mar 21 2017 08:48
@Moiezbabar show your code
@feedmecode-01 go to your codepen profile and u'll find it
Qwassi
@Qwassi
Mar 21 2017 08:48
@aerir There's nothing wrong. What's the error?
Machiel Van Der Toorn
@mcvdt07
Mar 21 2017 08:48
@azaraliyev var modifiedWords = words.map(function(word) { <---this line is where we specify that we want to have our newTitle
May Kittens Devour Your Soul
@diomed
Mar 21 2017 08:49
@Qwassi shush
aerir
@aerir
Mar 21 2017 08:49
@diomed thanks!
CamperBot
@camperbot
Mar 21 2017 08:49
aerir sends brownie points to @diomed :sparkles: :thumbsup: :sparkles:
:star2: 3514 | @diomed |http://www.freecodecamp.com/diomed
Lance
@texass2010