These are chat archives for FreeCodeCamp/Help

21st
Mar 2016
Philip
@philipd321
Mar 21 2016 00:00
@shanabosshill thank you this is the closest ive gotten, i have one error "make sure all my divs have a closing tag" im searching for that div, i dont see it.
CamperBot
@camperbot
Mar 21 2016 00:00
philipd321 sends brownie points to @shanabosshill :sparkles: :thumbsup: :sparkles:
:star: 135 | @shanabosshill | http://www.freecodecamp.com/shanabosshill
crakapps
@crakapps
Mar 21 2016 00:01
thanks @brandon95547
CamperBot
@camperbot
Mar 21 2016 00:01
crakapps sends brownie points to @brandon95547 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for brandon95547
brandon95547
@brandon95547
Mar 21 2016 00:01
@camperbot thx
CamperBot
@camperbot
Mar 21 2016 00:01
brandon95547 sends brownie points to @camperbot :sparkles: :thumbsup: :sparkles:
:star: 1393 | @camperbot | http://www.freecodecamp.com/camperbot
Matt
@YoshiBlues
Mar 21 2016 00:02
Yo I really need a help, can't figure out how to create space from the bottom of the picture, to the top of "Short Biography"
and for some reason it's not spaced right..
brandon95547
@brandon95547
Mar 21 2016 00:02
You don't want to use the margin that way
Matt
@YoshiBlues
Mar 21 2016 00:02
Okay, how should I?
brandon95547
@brandon95547
Mar 21 2016 00:05
Yoshi
instead of doing 5%
you can definitely do a margin-top: 16px
so, <h2 style="margin-top: 16px;">
Matt
@YoshiBlues
Mar 21 2016 00:06
I entered that and it didn't change the page at all
brandon95547
@brandon95547
Mar 21 2016 00:06
the reason for that is the 5% represents the parent div and you really want to stay away from percentage margins
have a link?
Shana Marie
@shanabosshill
Mar 21 2016 00:09
Anyone have a minute to help me target a photo on dropbox for the Tribute project?
brandon95547
@brandon95547
Mar 21 2016 00:09
are you talking about pushing the "Lyle Mays on the left, Pat Metheny on the right." down
Manish Giri
@Manish-Giri
Mar 21 2016 00:09
@shanabosshill yep, go ahead
Teh
@yestka
Mar 21 2016 00:10
hi, I need your help: Your image should have a src attribute that points to the kitten image.
Matt
@YoshiBlues
Mar 21 2016 00:10
nah, that url isn't displaying what I'm actually seeing
Manish Giri
@Manish-Giri
Mar 21 2016 00:10
@yestka did you have a specific question?
Shana Marie
@shanabosshill
Mar 21 2016 00:10
@Manish-Giri I have the photo in my dropbox. I'm typing
<img src="https://www.dropbox.com/s/ptwhv2pt6o0aab2/Pop -pop%20in%20uniform.jpg?dl=0" class="responsive">
Teh
@yestka
Mar 21 2016 00:10
Added : <img src="https://s3.amazonaws.com/freecodecamp/relaxing-cat.jpg">
Shana Marie
@shanabosshill
Mar 21 2016 00:10
and not getting the image.
Teh
@yestka
Mar 21 2016 00:11
image shown on screen, but when run test, it
Manish Giri
@Manish-Giri
Mar 21 2016 00:11
@shanabosshill replace the www in the dropbox link with dl
Matt
@YoshiBlues
Mar 21 2016 00:11
I've found my problem @brandon95547 Here is the same url with a smaller image size
Teh
@yestka
Mar 21 2016 00:11
the error shown: Your image should have a src attribute that points to the kitten image.
Shana Marie
@shanabosshill
Mar 21 2016 00:11
@Manish-Giri didn't do anything
Manish Giri
@Manish-Giri
Mar 21 2016 00:12
@yestka show your code
Teh
@yestka
Mar 21 2016 00:12

<link href="http://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://s3.amazonaws.com/freecodecamp/relaxing-cat.jpg">

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

Shana Marie
@shanabosshill
Mar 21 2016 00:12
I got it!!! Thanks @Manish-Giri
CamperBot
@camperbot
Mar 21 2016 00:12
shanabosshill sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star: 792 | @manish-giri | http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Mar 21 2016 00:12
@shanabosshill cool
@yestka is the link to the image correct?
brandon95547
@brandon95547
Mar 21 2016 00:13
do you want the short biography to be beneath the first image yoshi?
Matt
@YoshiBlues
Mar 21 2016 00:13
yeah @brandon95547 I think I got it tho
But i had to increase the margin size to 600px O.o
idk if thats what I should do
Teh
@yestka
Mar 21 2016 00:15
Got it, I used the redirect instead of the given link. Thanks @Manish-Giri
CamperBot
@camperbot
Mar 21 2016 00:15
yestka sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star: 793 | @manish-giri | http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Mar 21 2016 00:15
@yestka cool, welcome
Matt
@YoshiBlues
Mar 21 2016 00:18
@brandon95547 Thanks for your help anyways!
CamperBot
@camperbot
Mar 21 2016 00:18
yoshiblues sends brownie points to @brandon95547 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for brandon95547
Kevin
@KevinBruland
Mar 21 2016 00:22
I apologize, but I am stuck stuck on this really basic and elementary thing... I am trying to understand margins with divs
I cant figure out why there is not a top margin on:
Luke Barry
@LukeBarry
Mar 21 2016 00:23
I am working on a tribute page. I have .png photos on my desktop that I want to add to my tribute page. I tried uploading them to google photos and then using those links to no avail. Anyone know how to share files in HTML?
Nicole S.
@nicolesteck
Mar 21 2016 00:24
Working on the portfolio and I'm hoping someone can help me get started. We are, per directions, supposed to reverse engineer the page -- but much of this is not stuff we saw in FCC primers. Is it kosher to use a reference like the following? http://code.tutsplus.com/tutorials/a-simple-parallax-scrolling-technique--net-27641
crakapps
@crakapps
Mar 21 2016 00:25
@LukeBarry maybe tumblr an image hosting site? I just hotlinked for the tribute page but my friend let me use subdomain on his site to host my images for later projects
@nicolesteck directions say use any dependencies you want, so I think thats ok
Ünal Tenekeci
@unaltenekeci
Mar 21 2016 00:27
Set the value of your placeholder attribute to "cat photo URL". what is this?
<input type="text" placeholder="this is placeholder text">
Jeff
@meankraken
Mar 21 2016 00:28
@unaltenekeci for that input, do placeholder="Cat Photo URL"
Ünal Tenekeci
@unaltenekeci
Mar 21 2016 00:29
ok :) thanks
i thought i should set the attribute to an url
Luke Barry
@LukeBarry
Mar 21 2016 00:29
@crakapps Thanks. I got it now. I googled image hosting sites. The first link, postimg.org, allowed me to create a direct link in 2 seconds. Thanks again.
CamperBot
@camperbot
Mar 21 2016 00:29
lukebarry sends brownie points to @crakapps :sparkles: :thumbsup: :sparkles:
:star: 229 | @crakapps | http://www.freecodecamp.com/crakapps
smokemirrors
@smokemirrors
Mar 21 2016 00:32
need help making a dead link
Jeff
@meankraken
Mar 21 2016 00:33
@smokemirrors <a href="#">Stuff </a>
Pedro Díaz S.
@pjstol
Mar 21 2016 00:33
anybody with the PENNY 0.03 problem?
smokemirrors
@smokemirrors
Mar 21 2016 00:34
Thank you meankraken
Jeff
@meankraken
Mar 21 2016 00:35
lol pj I actually know exactly what you're talking about cause I just did that one...
you need to use .toFixed(2) to round your numbers to two decimals, otherwise the decimal math won't be exact
Tirzah Morrison
@tirzahmorrison
Mar 21 2016 00:42
Can anyone show me how they set this up?
Nest your first image and your h2 element within a single <div class="row"> element. Nest your h2 element within a <div class="col-xs-8"> and your image in a <div class="col-xs-4"> so that they are on the same line.
Savier
@Savier12
Mar 21 2016 00:46

hey guys I'm stuck I'm trying to prioritize one style over another <style>
pink-text {
color: pink;
}
body {
background-color: black;
font-family: Monospace;
color: green;
}
</style>

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

did i do my pink-text correct?
Gerardo115
@Gerardo115
Mar 21 2016 00:47
hey guys need some help
KyrieEeleison
@KyrieEeleison
Mar 21 2016 00:47
Aren't you missing the "." in your "pink-text"? It should be ".pink-text"
With the ""
you should only use the "." inside the <style> element not in class="pink-text"
Abdul Awali
@awalthefirst
Mar 21 2016 00:49
@timcroghan
<style>
  .red-text {
    color: red;
  }

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

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

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

<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>
Jin Choi
@JiniHendrix
Mar 21 2016 00:49
can anyone help with the Map the Debris bonfire? about changing altitude into orbital Periods
CamperBot
@camperbot
Mar 21 2016 00:49
type bonfire name to get some info on that bonfire. And check HelpBonfires chatroom
Jin Choi
@JiniHendrix
Mar 21 2016 00:50
bonfire Map the Debris
CamperBot
@camperbot
Mar 21 2016 00:50

:fire:Bonfire: Map the Debris :link:

function orbitalPeriod(arr) {
  var GM = 398600.4418;
  var earthRadius = 6367.4447;
  return arr;
}

orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]);

Return a new array that transforms the element's average altitude into their orbital periods.

more info:  bf details | bf links | hint

Savier
@Savier12
Mar 21 2016 00:50
thanks @KyrieEeleison @timcroghan
CamperBot
@camperbot
Mar 21 2016 00:50
savier12 sends brownie points to @kyrieeeleison and @timcroghan :sparkles: :thumbsup: :sparkles:
:star: 9 | @timcroghan | http://www.freecodecamp.com/timcroghan
:star: 22 | @kyrieeeleison | http://www.freecodecamp.com/kyrieeeleison
Jin Choi
@JiniHendrix
Mar 21 2016 00:50
hint
CamperBot
@camperbot
Mar 21 2016 00:50
:construction: Spoilers are only in the Bonfire's Custom Room :point_right:
Jin Choi
@JiniHendrix
Mar 21 2016 00:50
bf details
CamperBot
@camperbot
Mar 21 2016 00:50

:fire:Bonfire: Map the Debris :link:

function orbitalPeriod(arr) {
  var GM = 398600.4418;
  var earthRadius = 6367.4447;
  return arr;
}

orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]);
Return a new array that transforms the element's average altitude into their orbital periods.
The array will contain objects in the format <code>{name: 'name', avgAlt: avgAlt}</code>.
You can read about orbital periods <a href="http://en.wikipedia.org/wiki/Orbital_period" target='_blank'>on wikipedia</a>.
The values should be rounded to the nearest whole number. The body being orbited is Earth.
The radius of the earth is 6367.4447 kilometers, and the GM value of earth is 398600.4418
Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/How-to-get-help-when-you-get-stuck' target='_blank'>RSAP</a> if you get stuck. Try to pair program. Write your own code.
links:
Jin Choi
@JiniHendrix
Mar 21 2016 00:50
bf links
CamperBot
@camperbot
Mar 21 2016 00:50
links:
Jin Choi
@JiniHendrix
Mar 21 2016 00:50
function orbitalPeriod(arr) {
  var finalArr = [];
  for(var i = 0; i < arr.length; i++) {
    var a = 6367444.7 + arr[i].avgAlt*1000;

    var orbitalPeriod = Math.round(2 * Math.PI * Math.sqrt(Math.pow(a, 3) / 398600.4418));


    finalArr.push({name:arr[i].name, orbitalPeriod: orbitalPeriod});
  }
  return finalArr;
}

orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]);
Gerardo115
@Gerardo115
Mar 21 2016 00:50
hey, how do you do that? post a picture of what you code looks like?
Jonathan
@jonathantimm
Mar 21 2016 00:51
help format
CamperBot
@camperbot
Mar 21 2016 00:51

:point_right: code formatting [wiki]

Multi line Code

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

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

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

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

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

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

Gerardo115
@Gerardo115
Mar 21 2016 00:52
'''
html
CamperBot
@camperbot
Mar 21 2016 00:52
:bulb: to format code use backticks! ``` more info
Gerardo115
@Gerardo115
Mar 21 2016 00:52
hm....
Jin Choi
@JiniHendrix
Mar 21 2016 00:52
under you escape key
not single quotes
Gerardo115
@Gerardo115
Mar 21 2016 00:52
yea i didn't think that was right
thanks
Jonathan
@jonathantimm
Mar 21 2016 00:56
can anyone help with an issue i'm having?
if you click through the answers hitting yes every time, and then hit 'explore more', nothing comes up
not clear why, because every other page comes up the exact same way
Gerardo115
@Gerardo115
Mar 21 2016 00:58
I'm not sure :/ sorry. I'm just a beginner
`<p>Hello</p>
<p>Hello</p>
<<form action="/submit-cat-photo">
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
  <input type="radio" name="indoor-outdoor"> indoor
  <input type="radio" name="indoor-outdoor"> outdoor
</form>>
sweet. figured that out....
Pedro Díaz S.
@pjstol
Mar 21 2016 01:00
@meankraken thank you!!! I guess it would work better that way.. my workaround was to add+0.01 in case of being in the PENNY case in the for{}
CamperBot
@camperbot
Mar 21 2016 01:00
pjstol sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 320 | @meankraken | http://www.freecodecamp.com/meankraken
Gerardo115
@Gerardo115
Mar 21 2016 01:01
ok. I figured out how to send code. Anyone available to help me now?
Johnathan Brown
@Legend28469
Mar 21 2016 01:02

@brandonwoz you need to use the flags

Like this

$("button").on("click", function() {
        if (!flag) {
          $(".tempDiv").text(celTemp);
          flag = true;
        } else {
          $(".tempDiv").text(temp);
          flag = false;
        }
      });
Gerardo115
@Gerardo115
Mar 21 2016 01:03
<form action="/submit-cat-photo">
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
  <input type="radio" name="indoor-outdoor"> indoor
  <input type="radio" name="indoor-outdoor"> outdoor
</form>
AHHHH that's better!
Darrel Adams
@dadams-510
Mar 21 2016 01:03
Hey @Gerardo115, what are you trying to do?
Gerardo115
@Gerardo115
Mar 21 2016 01:04
well i was trying to figure out how to properly send code. Figured that out.
Now, I'm trying to figure out why my code isn't working.
Darrel Adams
@dadams-510
Mar 21 2016 01:05
@Gerardo115 What's the challenge called?
Gerardo115
@Gerardo115
Mar 21 2016 01:05
challenge is creat a set of radio buttons
Gerardo115
@Gerardo115
Mar 21 2016 01:06
yea, thats the one
Darrel Adams
@dadams-510
Mar 21 2016 01:07
Looks like you don't have the <label> element nested within the input radio buttons.
Gerardo115
@Gerardo115
Mar 21 2016 01:07
yea. I'm trying to rework it. I'll see if it works out the way I'm picturing it now.
Darrel Adams
@dadams-510
Mar 21 2016 01:07
@Gerardo115 Each of your two radio button elements should be nested in its own label element.
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:07
It should
aareeder
@aareeder
Mar 21 2016 01:08
Your h1 element should have the class pink-text? is that not {color:pink}?
Jeff
@meankraken
Mar 21 2016 01:08
@pjstol ah glad it's working
Gerardo115
@Gerardo115
Mar 21 2016 01:08
ha alexander hamilton
Terrell Vest
@MirPresT
Mar 21 2016 01:09
anyone have experience using auth0 for user authentication?
Darrel Adams
@dadams-510
Mar 21 2016 01:10
@Gerardo115 did your html work?
Gerardo115
@Gerardo115
Mar 21 2016 01:10
Yep. Thanks for the help.
That's what I tried at first but it wouldn't take it. Must have been doing something wrong to begin with.
Curious what it was now.
Jonathan
@jonathantimm
Mar 21 2016 01:11
can anybody help with my question above? :-S
Jordan Meyer
@Jordanmeyer89
Mar 21 2016 01:12
ANyone know stuf about buttons?
Darrel Adams
@dadams-510
Mar 21 2016 01:12
Hey @jonathantimm what was your question again?
Jonathan
@jonathantimm
Mar 21 2016 01:12
http://codepen.io/jonathantimm/pen/WwrNaN?editors=1000
if you click through the answers hitting yes every time, and then hit 'explore more', nothing comes up
not clear why, because every other page comes up the exact same way
aareeder
@aareeder
Mar 21 2016 01:13
I can't answer why but yeah I clicked through and got nothing on explore more
Brandon Wozniewicz
@brandonwoz
Mar 21 2016 01:14
@Legend28469 Thanks! I was just learning this in another fcc room as well. I appreciate your response. I was telling the other individual how simple the code is, but I would have easily spent the better part of a week hitting my head against a wall lol...thanks again.
CamperBot
@camperbot
Mar 21 2016 01:14
brandonwoz sends brownie points to @legend28469 :sparkles: :thumbsup: :sparkles:
:star: 441 | @legend28469 | http://www.freecodecamp.com/legend28469
Darrel Adams
@dadams-510
Mar 21 2016 01:15
@jonathantimm Yeah, getting the same issue. "Explore more" when I tested it isn't going anywhere.
Jonathan
@jonathantimm
Mar 21 2016 01:16
it's weird because it's written teh same way as every other page coming up
Matt Leonard
@matty22
Mar 21 2016 01:17
How can I set a timer. I don't want to do anything with it aside from stop the following code from running until the timer is over.
Here's what I'm trying:
window.setTimeout(gameReset(), 50000);
aareeder
@aareeder
Mar 21 2016 01:19
Your h1 element should have the class pink-text? is that not h1 {color:pink}?
Matt Leonard
@matty22
Mar 21 2016 01:20
I mean that function gameReset() should run after 50s.
Tia Holiday
@tlholiday
Mar 21 2016 01:21
Need some help for the HTML green background on form help. Error I'm getting is "do not give you form any class or style attributes"

<link href="http://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;
}

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

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

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

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

<div class="gray-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" div class = "green-background">
<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>

Gerardo115
@Gerardo115
Mar 21 2016 01:23
<link href="http://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;
  }

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

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

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

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

<div class="gray-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" div class = "green-background">
  <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>
There you go. That's more legible :)
Jonathan
@jonathantimm
Mar 21 2016 01:24
thanks for looking @dadams-510
CamperBot
@camperbot
Mar 21 2016 01:24
jonathantimm sends brownie points to @dadams-510 :sparkles: :thumbsup: :sparkles:
:star: 313 | @dadams-510 | http://www.freecodecamp.com/dadams-510
Tia Holiday
@tlholiday
Mar 21 2016 01:24
@Gerardo115 were you just reposting it for me, or was the the answer to the help I was wanting? Also..how'd you do that? Lol.
Gerardo115
@Gerardo115
Mar 21 2016 01:25
I was reposting it. It helps to read as you can tell and I actually just learned it myself :)

KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:25
Well, you shouldn't give your <form> element a class= or style= attribute... Have you tried making all <form> elements green in the <style> element?
Tia Holiday
@tlholiday
Mar 21 2016 01:25
@Gerardo115 Super cool! How'd you do it?
Read over that.
Armand Curet
@armandcuret
Mar 21 2016 01:27
<style>
h2 {color: blue;}

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

</style>
what am I doing wrong?
Tia Holiday
@tlholiday
Mar 21 2016 01:27
@KyrieEeleison no, how do I do that? I don't understand how to make an element green without adding a div class...
Gerardo115
@Gerardo115
Mar 21 2016 01:27
your style is screwed up
Armand Curet
@armandcuret
Mar 21 2016 01:27
how do I fix it?
Gerardo115
@Gerardo115
Mar 21 2016 01:27
<style>
ugh hold on
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:28

@tlholiday

<style>
form {
background-color: green;
}

</style>
Gerardo115
@Gerardo115
Mar 21 2016 01:28
yea. something like that
Tia Holiday
@tlholiday
Mar 21 2016 01:28
Ooooo I see now, I add it to the class styles above...Gotcha. Thank you @KyrieEeleison!
CamperBot
@camperbot
Mar 21 2016 01:28
tlholiday sends brownie points to @kyrieeeleison :sparkles: :thumbsup: :sparkles:
:star: 27 | @kyrieeeleison | http://www.freecodecamp.com/kyrieeeleison
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:29
@armandcuret your <p> attributes should be outside the <style></style>
Tia Holiday
@tlholiday
Mar 21 2016 01:29
@Gerardo115 Thank you for the link & your help also :)
CamperBot
@camperbot
Mar 21 2016 01:29
tlholiday sends brownie points to @gerardo115 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for gerardo115
Armand Curet
@armandcuret
Mar 21 2016 01:29

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

like that?
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:30
Yes
Armand Curet
@armandcuret
Mar 21 2016 01:30
for some reason my h2 element is still not blue
Jeff
@meankraken
Mar 21 2016 01:31
@armandcuret can you paste the full code
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:31
You don't have an <h2> element
Armand Curet
@armandcuret
Mar 21 2016 01: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>

KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:32
You don't have a header
Armand Curet
@armandcuret
Mar 21 2016 01:32
how would one look like?
David Weedmark
@DavidWeedmark
Mar 21 2016 01:32
@armandcuret you just need to add <h2> </h2> around the words you want blue
Armand Curet
@armandcuret
Mar 21 2016 01:33
oh, ok... wow that was easy
Catherine Kelley
@xaublae
Mar 21 2016 01:35
I feel like an idiot but, I need help. I am working on the "Learn how Script Tags and Document Ready Work" lesson. I have typed in exactly the code that is asked for and it is not working.
Jonathan
@jonathantimm
Mar 21 2016 01:35
any experts out there?
still stuck :S
David Weedmark
@DavidWeedmark
Mar 21 2016 01:36
@xaublae @jonathantimm want to share what you have?
Catherine Kelley
@xaublae
Mar 21 2016 01:37
<script>$(document).ready(funtion(){
});
</script>
Jeff
@meankraken
Mar 21 2016 01:37
@xaublae function*
Gerardo115
@Gerardo115
Mar 21 2016 01:38
Ha! Damn I hate those.
Catherine Kelley
@xaublae
Mar 21 2016 01:38
confirmed I am an idiot lol
David Weedmark
@DavidWeedmark
Mar 21 2016 01:38
heh
Robert Mensing
@rmensing
Mar 21 2016 01:38
@jonathantimm What was it you needed help with?
Jeff
@meankraken
Mar 21 2016 01:38
@xaublae naah happens to everyone lol
David Weedmark
@DavidWeedmark
Mar 21 2016 01:38
@xaublae we should have t-shirts made
Gerardo115
@Gerardo115
Mar 21 2016 01:39
Yea but they drive me crazy cause I usually don't pick that mistake out as easily as others.
Catherine Kelley
@xaublae
Mar 21 2016 01:39
@meankraken @DavidWeedmark Thank you guys for your help
CamperBot
@camperbot
Mar 21 2016 01:39
xaublae sends brownie points to @meankraken and @davidweedmark :sparkles: :thumbsup: :sparkles:
Robert Mensing
@rmensing
Mar 21 2016 01:39
@xaublae I can' ttell you haw many time a typo has baffled me .
CamperBot
@camperbot
Mar 21 2016 01:39
:star: 322 | @meankraken | http://www.freecodecamp.com/meankraken
:star: 415 | @davidweedmark | http://www.freecodecamp.com/davidweedmark
David Weedmark
@DavidWeedmark
Mar 21 2016 01:39
I still type <img scr .... all the time instead of src
Jonathan
@jonathantimm
Mar 21 2016 01:40
http://codepen.io/jonathantimm/pen/WwrNaN?editors=1000
if you click through the answers hitting yes every time, and then hit 'explore more', nothing comes up
not clear why, because every other page comes up the exact same way @rmensing
Catherine Kelley
@xaublae
Mar 21 2016 01:40
I make stupid mistakes like that all the time and I miss them because they look right to me
Scott
@LionOfJudah2517
Mar 21 2016 01:40
having trouble I think on lesson 35
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:40
Our brain can be lazy like that sometimes. It imagines everything is spelled right
Scott
@LionOfJudah2517
Mar 21 2016 01:41
Nesting the form in the input text?
Robert Mensing
@rmensing
Mar 21 2016 01:41
@jonathantimm looking at it now...
Gerardo115
@Gerardo115
Mar 21 2016 01:41
Dude @DavidWeedmark I did that one of the first times I was doing an exercise dealing with images. Couldn't figure it out for the life of me.
yea, I tend to not fully read each word so typos are easy to miss.
Alexander Køpke
@alexanderkopke
Mar 21 2016 01:42
sometimes things that are spelled right look weird. I'm double checking and it still looks wrong but it's not lol
Catherine Kelley
@xaublae
Mar 21 2016 01:44
@alexanderkopke I am so glad I am not the only person who does that! When I get too "weirded out" by a word I will google it just to make sure that it really is spelled right
Jonathan
@jonathantimm
Mar 21 2016 01:45
thanks @rmensing, i'm strugglin
CamperBot
@camperbot
Mar 21 2016 01:45
jonathantimm sends brownie points to @rmensing :sparkles: :thumbsup: :sparkles:
:star: 325 | @rmensing | http://www.freecodecamp.com/rmensing
MahmoudHussain
@MahmoudHussain
Mar 21 2016 01:47

what is wrong with this ?!!

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

Scott
@LionOfJudah2517
Mar 21 2016 01:47
red-text? instead of red_text?
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:47
Does the exercise ask you to use underscore in "red_text"?
^
Gerardo115
@Gerardo115
Mar 21 2016 01:48
you guys are right
David Weedmark
@DavidWeedmark
Mar 21 2016 01:48
@MahmoudHussain nothing is wrong if you want everything red
Armand Curet
@armandcuret
Mar 21 2016 01:48

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


</style>

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

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

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

How do I give the elements with a P tag a font-zise of 16px
KyrieEeleison
@KyrieEeleison
Mar 21 2016 01:49
include the {font-size 16px} inside the <style> element
without the brackets {}
David Weedmark
@DavidWeedmark
Mar 21 2016 01:50
@armandcuret ```
Scott
@LionOfJudah2517
Mar 21 2016 01:50
<input type="text" placeholder="cat photo URL">
David Weedmark
@DavidWeedmark
Mar 21 2016 01:50
.red_text{ 
  color: red; 
  font-size: 16px;
  }
Scott
@LionOfJudah2517
Mar 21 2016 01:50
<input type="text" placeholder="cat photo URL">
MahmoudHussain
@MahmoudHussain
Mar 21 2016 01:50
@DavidWeedmark done thanks
CamperBot
@camperbot
Mar 21 2016 01:50
mahmoudhussain sends brownie points to @davidweedmark :sparkles: :thumbsup: :sparkles:
Armand Curet
@armandcuret
Mar 21 2016 01:50
oh wow it goes inside
Robert Mensing
@rmensing
Mar 21 2016 01:50
@jonathantimm At the moment it is changing the display of that div but it is coming up blank.
CamperBot
@camperbot
Mar 21 2016 01:50
:star: 416 | @davidweedmark | http://www.freecodecamp.com/davidweedmark
Scott
@LionOfJudah2517
Mar 21 2016 01:51
can't figure out how to nest the text field within a form?
I'm very confused
Gerardo115
@Gerardo115
Mar 21 2016 01:51
what's your code?
Catherine Kelley
@xaublae
Mar 21 2016 01:52
@LionOfJudah2517 that means to add it within the <form> add code here</form>
Jonathan
@jonathantimm
Mar 21 2016 01:52
@rmensing yeah, it's the same function i'm using elsewhere
it's working to reveal some divs but not others
Scott
@LionOfJudah2517
Mar 21 2016 01:53
<form action="/submit-cat-photo" <input type="text" placeholder="cat photo URL"></form>
Armand Curet
@armandcuret
Mar 21 2016 01:53

<style>

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

</style>

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

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

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

still not working
It says "Give elements with the p tag a font-size of 16px.
Scott
@LionOfJudah2517
Mar 21 2016 01:54
my goodness
nevermind
wow
I can't believe that I didn't try to add the form
sorry
Robert Mensing
@rmensing
Mar 21 2016 01:54
@jonathantimm I'm curious about the fact that the payBillPay2 div and the ones after it are children of payBillPay1 instead of siblings as all the previous ones were
David Weedmark
@DavidWeedmark
Mar 21 2016 01:54
@armandcuret your second paragraph doesn't have the class added to the <p> element
Jonathan
@jonathantimm
Mar 21 2016 01:54
ohh
Scott
@LionOfJudah2517
Mar 21 2016 01:54
thanks though @xaublae
CamperBot
@camperbot
Mar 21 2016 01:54
lionofjudah2517 sends brownie points to @xaublae :sparkles: :thumbsup: :sparkles:
:star: 117 | @xaublae | http://www.freecodecamp.com/xaublae
Jonathan
@jonathantimm
Mar 21 2016 01:54
@rmensing that's not supposed to be the case
Catherine Kelley
@xaublae
Mar 21 2016 01:55
@LionOfJudah2517 Sorry I'm not very good at explaining things
Jonathan
@jonathantimm
Mar 21 2016 01:55
@rmensing how can you tell they are children?
is a </div> missing?
Robert Mensing
@rmensing
Mar 21 2016 01:55
@jonathantimm that would be causing it. because payBillPay2 is inside payBillPay1 when you set display: none.
William Campbell
@Sufuninja
Mar 21 2016 01:56
<html>
<head>
    <title>Objects JSON JS</title>
</head>
<body>
    <h1>Objects JSON JS</h1>
<script>
(function () {
    // todo:
    // Create an array of objects that represent books.
    var books = [
        {name: "2001 A Space Odyssey",  author: {first: "Arthur C.",    last: "Clark"}},
        {name: "Hyperspace",            author: {first: "Michio",       last: "Kaku"}},
        {name: "The Great Gatsby",      author: {first: "Scott",        last: "Fitzgerald"}},
        {name: "Contact",               author: {first: "Carl",         last: "Sagan"}},
        {name: "The Shining",           author: {first: "Stephen",      last: "King"}}
    ];

    // Each book should have a title and an author.
    // The book author should be an object with a firstName and lastName.
    // Be creative and add at least 5 books to the array
    // var books = [todo];

    // log out the books array
    console.log(books);

    // todo:
    // Loop through the array of books using .forEach and print out the specified information about each one.
    // start loop here
    var logString = "";
    var logbooks = function(element, index, array){
        var bookNum = "Book #" + index;
        var author = "Author: " + array[index].author.first + ' ' + array[index].author.last;
        var title = "Title: " + array[index].name;
    console.log(bookNum);
    console.log(title);
    console.log(author);
    console.log("---");
    document.write(bookNum + "<br>" + author + "<br>" + title + "<br>" + "---" + "<br><br>");
    };

    var myLog = books.forEach(logbooks);
// end loop here
})();
</script>
</body>
</html>
Why does function write to the page when I havent called the function yet?
Robert Mensing
@rmensing
Mar 21 2016 01:56
@jonathantimm in the dev tools it shows them nested. I can't see it unless I open/expand payBillPay1
Armand Curet
@armandcuret
Mar 21 2016 01:57

<style>

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

</style>

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

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

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

It still says "Give elements with the p tag a font-size of 16px.
Jonathan
@jonathantimm
Mar 21 2016 01:58
@rmensing you're right, there was a missing </div>
David Weedmark
@DavidWeedmark
Mar 21 2016 01:58
@armandcuret both paragraphs need to start with <p class="red-text">
Jonathan
@jonathantimm
Mar 21 2016 01:58
i just added a closing div tag to the payBillPay1 section and it looks like it's working now
you are a GENIUS :P
thank you @rmensing !
CamperBot
@camperbot
Mar 21 2016 01:58
jonathantimm sends brownie points to @rmensing :sparkles: :thumbsup: :sparkles:
:warning: jonathantimm already gave rmensing points
Armand Curet
@armandcuret
Mar 21 2016 01:59
now I have two errors

<style>

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

</style>

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

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

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

Gerardo115
@Gerardo115
Mar 21 2016 01:59
<style>
p {
font-size: 16px;
</style>
Jonathan
@jonathantimm
Mar 21 2016 01:59
can you tell how much of a noob i am from looking at that terrible code? heh
David Weedmark
@DavidWeedmark
Mar 21 2016 02:00
@armandcuret what's the exercise name?
Gerardo115
@Gerardo115
Mar 21 2016 02:00
quick question, what is a "form?"
Robert Mensing
@rmensing
Mar 21 2016 02:00
@jonathantimm you're welcome :) dunno about genius though. I have gotten good at debugging with A LOT of practice on my own code.
Stephen
@balomus
Mar 21 2016 02:00

Hey everyone! I'm having issues with a navbar. I have a feeling I just don't understand how part of it works, because the way I have it written I think I should be able to have it coded this way.

  <nav class="navbar navbar-inverse navbar-fixed-top navbar-settings" role="navigation">
      <!-- Navbar Header -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">Stephen Mercier</a>
      </div>
      <!-- END Navbar Header -->
      <!-- List out the nav links, will be toggled if necessary -->
      <div class="collapse navbar-collapse navbar-right" id="myNavbar">
        <ul class="nav navbar-nav">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">About</a></li>
          <li><a href="#">Portfolio</a></li>
          <li><a href="#">Contact</a></li>
        </ul>
      </div>
    <!-- END nav links -->
  </nav>

  <!-- END Navigation Bar -->

The issue is the button on the far-right is cut-off slightly. Any ideas? Here's my codepen. http://codepen.io/sjmercier/pen/WwpENZ

Gerardo115
@Gerardo115
Mar 21 2016 02:00
Is there a certain definition to it?
Armand Curet
@armandcuret
Mar 21 2016 02:00
"Change the Font Size of an Element"

<style>
p{

font-size: 16px;
}

</style>

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

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

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

David Weedmark
@DavidWeedmark
Mar 21 2016 02:02
@armandcuret ah. I thought you wanted all the <p> red and 16px, but it's just the first paragraph, so remove the class from the second paragraph
that link explains em
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form << that one is more helpful, an intro tutorial on html forms
Armand Curet
@armandcuret
Mar 21 2016 02:03
thank you
David Weedmark
@DavidWeedmark
Mar 21 2016 02:03
@armandcuret that did it?
I should have asked the excercise name first sorry
Gerardo115
@Gerardo115
Mar 21 2016 02:04
Thanks @jonathantimm
CamperBot
@camperbot
Mar 21 2016 02:04
gerardo115 sends brownie points to @jonathantimm :sparkles: :thumbsup: :sparkles:
:star: 423 | @jonathantimm | http://www.freecodecamp.com/jonathantimm
Reigo
@rtuulik
Mar 21 2016 02:07
@balomus you have padding-right set to 0
Stephen
@balomus
Mar 21 2016 02:09
@rtuulik I don't think so, I just did Ctrl+F for padding in my HTML and CSS and didn't find it. I did manage to get it to behave as expected by containing the entire navigation code inside a
<div class="container-fluid">
</div>
Or were you suggesting to try that?
Chris
@The-Mister
Mar 21 2016 02:10
Hey guys, working on my portfolio. I am unsure how to be using container/container-fluid. Do I just encapsulate very single section in a container-fluid, or should I just nest the entire page in one div?
Stephen
@balomus
Mar 21 2016 02:10
@The-Mister Haha, I think I am having exactly the same types of problems. I feel like I'm starting to get it though...
Reigo
@rtuulik
Mar 21 2016 02:11
@balomus No. Your pen had @media (min-width: 768px)
.navbar-fixed-top .navbar-collapse, {
padding-right: 0;
padding-left: 0;
}
Chris
@The-Mister
Mar 21 2016 02:11
@balomus Are you just wrapping everything in containers just in case? It feels messy to me
Reigo
@rtuulik
Mar 21 2016 02:11
When I removed the padding-right: 0; it became okay
Stephen
@balomus
Mar 21 2016 02:11
@rtuulik Where at? I'm sorry, I don't see that in my HTML or CSS.
@The-Mister Basically, the approach I'm using is wrap everything in a <div> but ONLY use that for things that you really want applied to everything. I do not use a container or container-fluid class for that particular div
Reigo
@rtuulik
Mar 21 2016 02:12
@balomus Google Chrome, right click, inspect :)
Probably gets added in the background
Stephen
@balomus
Mar 21 2016 02:13
I use the container or container-fluid as needed for various sections through my page.
@rtuulik Interesting, any idea how that is being added? I assume it's from importing jquery or bootstrap via Settings > JavaScript > Add External JavaScript
Chris
@The-Mister
Mar 21 2016 02:14
Do we not need to use containers for everything? I kind of understood the lessons as saying that only when using a container will that part be responsive. Is that wrong?
Reigo
@rtuulik
Mar 21 2016 02:15
@balomus probably something from Bootstraps, not very familiar with that.
But adding .container-fluid solves the issue, because .container-fluid adds 15px padding on the sides
Stephen
@balomus
Mar 21 2016 02:15
@rtuulik Ah that makes a lot of sense. I think it also sort of answers @The-Mister's question as well
Armand Curet
@armandcuret
Mar 21 2016 02:15
I'm having trouble with "Size your Images"

<link href="http://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">
.smaller-image {
width: 100px;
}

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

Chris
@The-Mister
Mar 21 2016 02:16
@rtuulik So .container-fluid has a "built-in" padding of 15px?
Stephen
@balomus
Mar 21 2016 02:17
@The-Mister I think Bootstrap, since it's just a JS framework, is basically that. It makes a bunch of classes that we can utilize that simplify some of the formatting stuff. I need to read through the documentation for .container and .container-fluid though.
cannelflow
@cannelflow
Mar 21 2016 02:17
@armandcuret create class cmaller-image here at <img src="https://bit.ly/fcc-relaxing-cat"> and move .smaller-image {
width: 100px;
} in between <style></style>
Reigo
@rtuulik
Mar 21 2016 02:18
@The-Mister Yeah, container-fluid adds 15px on each side of the page
Chris
@The-Mister
Mar 21 2016 02:18
Thanks @balomus and @rtuulik . I will refer to the docs for more info
CamperBot
@camperbot
Mar 21 2016 02:18
the-mister sends brownie points to @balomus and @rtuulik :sparkles: :thumbsup: :sparkles:
:star: 150 | @rtuulik | http://www.freecodecamp.com/rtuulik
:star: 131 | @balomus | http://www.freecodecamp.com/balomus
Reigo
@rtuulik
Mar 21 2016 02:18
@balomus Bootstrap is a CSS framework, not JS one :)
Stephen
@balomus
Mar 21 2016 02:18
Yeah, thanks to @The-Mister and @rtuulik as well!
CamperBot
@camperbot
Mar 21 2016 02:18
balomus sends brownie points to @the-mister and @rtuulik :sparkles: :thumbsup: :sparkles:
:star: 151 | @rtuulik | http://www.freecodecamp.com/rtuulik
:star: 135 | @the-mister | http://www.freecodecamp.com/the-mister
Armand Curet
@armandcuret
Mar 21 2016 02:20

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

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

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

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

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

how do I make a class smaller-image to my img element?
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:21
add a class= attribute to your <img> element
cannelflow
@cannelflow
Mar 21 2016 02:21
<img class="abc" /> @armandcuret
Darrel Adams
@dadams-510
Mar 21 2016 02:24
@armandcuret Add in the "Class" attribute before your src call
Tia Holiday
@tlholiday
Mar 21 2016 02:24

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

<h1>Hello World!</h1>

Darrel Adams
@dadams-510
Mar 21 2016 02:25
Hi @tlholiday
What are you trying to do?
Tia Holiday
@tlholiday
Mar 21 2016 02:26
Whoops, didn't work, BUT Need some help...(obviously) I have an error that my h1 element should have a pink-text class and my CSS style should have a Pink text...any idea what I did wong?
Darrel Adams
@dadams-510
Mar 21 2016 02:26
@tlholiday end it with a semicolon
h1 {
color: pink;
cannelflow
@cannelflow
Mar 21 2016 02:27
@tlholiday you need to add class pink text here <h1>Hello World!</h1> then give that class prpoerty in css
Darrel Adams
@dadams-510
Mar 21 2016 02:27
maybe that will work?
Jared Pranke
@EtherWolf
Mar 21 2016 02:27
You have to attribute a class to your h1 element
Darrel Adams
@dadams-510
Mar 21 2016 02:27
@tlholiday you can add in a class attribute to your h1 element.
Jared Pranke
@EtherWolf
Mar 21 2016 02:27
You can style your element just using an element selector, but for that exercise they want you to style via a class selector
Darrel Adams
@dadams-510
Mar 21 2016 02:28
<h1 class="pink-text"> for example.
Tia Holiday
@tlholiday
Mar 21 2016 02:28
I understand that, but how @EtherWolf @dadams-510 ??
cannelflow
@cannelflow
Mar 21 2016 02:28
<h1 class="acb"></h1> @tlholiday
Darrel Adams
@dadams-510
Mar 21 2016 02:28
@tlholiday when using CSS and you calling a class attribute element, you use the dot function.
For example .someClass {
color:pink;
}

@tlholiday

.someClass {
background-color: pink;
}

cannelflow
@cannelflow
Mar 21 2016 02:29
in css .acb{name:value;}
Darrel Adams
@dadams-510
Mar 21 2016 02:29
@tlholiday make sure to start calling the class with the "." (dot) in the beginning of the CSS.
Tia Holiday
@tlholiday
Mar 21 2016 02:30
So I missed something in my style...got it..well I still have one more error (mer frustrating). I get the concept, but I'm missing the tangible application of it.
Darrel Adams
@dadams-510
Mar 21 2016 02:30
What do you have so far and which challenge is it? @tlholiday
cannelflow
@cannelflow
Mar 21 2016 02:31
@tlholiday show your code
Tia Holiday
@tlholiday
Mar 21 2016 02:32

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

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

I get I need a .class, but when I add it I turns everything green again, and it still has an error
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:33

you have to add
.pink-text {
color: pink;
}

inside <style>

Darrel Adams
@dadams-510
Mar 21 2016 02:33
@tlholiday since you declared "pink-text" in your h1 element you have to call it by that name.
cannelflow
@cannelflow
Mar 21 2016 02:33
which exercise @tlholiday instead h1{
color: pink;
} do like .pink-text{}
OneilDotel
@OneilDotel
Mar 21 2016 02:33
anyone please can help with challenge 88 ?
Darrel Adams
@dadams-510
Mar 21 2016 02:33
Your CSS is saying to change ALL H1s, but you just want to change that h1 element only. @tlholiday
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:33
What's the name of 88?
OneilDotel
@OneilDotel
Mar 21 2016 02:34
Responsively Style Radio Buttons
Tia Holiday
@tlholiday
Mar 21 2016 02:34
Challenge Prioritize One Style Over Another
cannelflow
@cannelflow
Mar 21 2016 02:34
@OneilDotel tried something?
Jared Pranke
@EtherWolf
Mar 21 2016 02:34
<style>
.pink-text {    /*the bit that is on the left side of the opening curly brace is a selector...not just any selector....a CLASS selector.*/
color: pink;  /*Any element you attribute this class to, whatever properties you assign to the style....that element will now have*/
}

h1 {      /*The bit that is on the left side of the opening curly brace is an element selector....it will select and style EVERY h1 element on your page.*/
color: pink;
}
</style>
<h1 class="pink-text"> Some words</h1>   <!-- Here you are "connecting" (attributing) the class of pink-text to the h1 element so you can style it -->
Tia Holiday
@tlholiday
Mar 21 2016 02:34
@dadams-510 again, I understand that, but what do I WRITE in the code to change that
again, I understand the concept, what to physically write is what is tripping me up.
Darrel Adams
@dadams-510
Mar 21 2016 02:35
@tlholiday, you have your HTML correct. Just need to change the "h1" to ".pink-text"

@tlholiday

```
.pink-text {

.pink-text {
color:pink;
}
OneilDotel
@OneilDotel
Mar 21 2016 02:36
sure @cannelflow i just miss the second task
Darrel Adams
@dadams-510
Mar 21 2016 02:36
@tlholiday change the CSS declaration
Tia Holiday
@tlholiday
Mar 21 2016 02:36
Got it, thank you for the patience and help @EtherWolf & @dadams-510
CamperBot
@camperbot
Mar 21 2016 02:36
tlholiday sends brownie points to @etherwolf and @dadams-510 :sparkles: :thumbsup: :sparkles:
:star: 315 | @etherwolf | http://www.freecodecamp.com/etherwolf
:star: 314 | @dadams-510 | http://www.freecodecamp.com/dadams-510
cannelflow
@cannelflow
Mar 21 2016 02:37
h1{<====remove h1 to .pink-text
color: pink;
}
@tlholiday
@OneilDotel show your code
Jared Pranke
@EtherWolf
Mar 21 2016 02:37
@tlholiday Keep at it :+1:
Tia Holiday
@tlholiday
Mar 21 2016 02:38
Thank you @cannelflow I got it now :-) I was missing something clearly obvious (merp)! Appreciate the help everyone.
CamperBot
@camperbot
Mar 21 2016 02:38
tlholiday sends brownie points to @cannelflow :sparkles: :thumbsup: :sparkles:
:star: 982 | @cannelflow | http://www.freecodecamp.com/cannelflow
OneilDotel
@OneilDotel
Mar 21 2016 02:38
a second
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:38
@OneilDotel <form action="/submit-cat-photo">
<div class="row">
<div class="col-xs-6">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
</div>
<div class=col-xs-6>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
</div>
</div>
</form>
Armand Curet
@armandcuret
Mar 21 2016 02:38

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

<p>Click here for <a href ="http://www.freecatphotoapp.com">cat photos</a>.</p>

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

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

Where do I put the "#" ?
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:38
@armandcuret href="#"
Armand Curet
@armandcuret
Mar 21 2016 02:39
thanks
Blake Harris
@bharris62
Mar 21 2016 02:42
This message was deleted
CamperBot
@camperbot
Mar 21 2016 02:42
:bulb: to format code use backticks! ``` more info
Blake Harris
@bharris62
Mar 21 2016 02:43
This message was deleted

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

<p>Click here for <a href ="http://www.freecatphotoapp.com">cat photos</a>.</p>
<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat">

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

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

what am i missing? lol
Jared Pranke
@EtherWolf
Mar 21 2016 02:44
This message was deleted
OneilDotel
@OneilDotel
Mar 21 2016 02:44
thanks everyone for help
i get it
Craig Morrison
@frogmorton
Mar 21 2016 02:45
Format code
Jared Pranke
@EtherWolf
Mar 21 2016 02:45
How do you escape backticks lol
Craig Morrison
@frogmorton
Mar 21 2016 02:46
Wiki code format
CamperBot
@camperbot
Mar 21 2016 02:46

:point_right: code formatting [wiki]

Multi line Code

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

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

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

Single line Code

This an inline `<paste code here>` code formatting with a single backtick(`) at start and end around the code.

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

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

Jared Pranke
@EtherWolf
Mar 21 2016 02:46
1. Type ``` into the chat input
2. Press enter
3.Copy and paste your code snippet
4. Press ctrl+enter or possibly shift+enter
*NOTE: Make sure all of your code is wrapped with the backticks. Start and bottom.
Craig Morrison
@frogmorton
Mar 21 2016 02:46
Guys, have a look at camperbot's instructions for formatting code
KyrieEeleison
@KyrieEeleison
Mar 21 2016 02:48
[html]
[/html]
cool
Craig Morrison
@frogmorton
Mar 21 2016 02:51
@EtherWolf , you can get your code color formatted by identifying the language after the first 3 backticks
Jared Pranke
@EtherWolf
Mar 21 2016 02:52
html,css,js gotcha
Craig Morrison
@frogmorton
Mar 21 2016 02:52
;)
Alexander Køpke
@alexanderkopke
Mar 21 2016 02:59
console has such great potential to make pranks
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:01
hello
kreddibletrout
@kreddibletrout
Mar 21 2016 03:03
Ug...
'Size Your Images' won't let me pass. My code is holy and pure. I've looked at the forum, does anyone know of a way to make it work in Firefox so I gon't have to sift around in my computer looking for... inter...something... exploder?
Andrea R.
@amr08
Mar 21 2016 03:03
Hello - In codepen- Any ideas on how to link a nav button to internal page (not external/local files). Ex: "about me" jumps down to about me page.
kreddibletrout
@kreddibletrout
Mar 21 2016 03:08
(actually, my code may not be holy or pure... from the forums it looks the same... tried it in Internet Exploder and same hag up...)
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:13
who has landed a job after learning at freecodebase.com
Jared Pranke
@EtherWolf
Mar 21 2016 03:17
@kreddibletrout Kinda lurky I know...but you take fantastic pictures of grapes dude.
kreddibletrout
@kreddibletrout
Mar 21 2016 03:21
@EtherWolf
hey there ho there! don't you go talkin about abother man's grapes! What kind of place is this?
...oh... THOSE grapes... yes, well... thank you.
CamperBot
@camperbot
Mar 21 2016 03:21
kreddibletrout sends brownie points to @etherwolf :sparkles: :thumbsup: :sparkles:
:star: 316 | @etherwolf | http://www.freecodecamp.com/etherwolf
kreddibletrout
@kreddibletrout
Mar 21 2016 03:23
@EtherWolf b'ai estie man! mon bon chum a Montreal! Merci, la!
Jared Pranke
@EtherWolf
Mar 21 2016 03:23
@kreddibletrout Thank you for bringing photo art to grapes. (Manfred's sphincter is GORGEOUS btw)
CamperBot
@camperbot
Mar 21 2016 03:23
etherwolf sends brownie points to @kreddibletrout :sparkles: :thumbsup: :sparkles:
:star: 23 | @kreddibletrout | http://www.freecodecamp.com/kreddibletrout
Jared Pranke
@EtherWolf
Mar 21 2016 03:23
For some reason I imagined you as a montrealer, the room collection felt so familiar.
kreddibletrout
@kreddibletrout
Mar 21 2016 03:23
...th'hell is this 'brownie points' business?
look at my avitar and imagine me sayin 'Y'got THAT right, brother!'
Kevin
@KevinBruland
Mar 21 2016 03:26
I am struggling to get a white font to look the same degree of boldness in Chrome... does anyone have experience with this?
Darrel Adams
@dadams-510
Mar 21 2016 03:27
I guess brownie points is like reddit karma
Kevin
@KevinBruland
Mar 21 2016 03:27
I have found a lot of info about antialiasing, but all of the code I have tried does not seem to work
Darrel Adams
@dadams-510
Mar 21 2016 03:27
@Benalron What does that look like exactly? Can you share an example of what you would like to do?
Kevin
@KevinBruland
Mar 21 2016 03:28
let me make an example really quick
kreddibletrout
@kreddibletrout
Mar 21 2016 03:31
... ok... ok... I figured it out. my code was shit. or, half shit. now I'm feeling better/upset that I didn't figure it out. @EtherWolf... I checked your code on the issue and saw my flaw. I'm indebted to you. Un chien-chaud sur moi.
Jared Pranke
@EtherWolf
Mar 21 2016 03:34
Un bon steame au belle pro sti
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:36
learning to code is fun. if you like let me know. I'm liking it. as a newbie with code. i'm beginning to take off. may be i'll be flying soon. but who knows, maybe we can partner and build something together...best hopes
sorry that took so long
Nikov
@nsieber
Mar 21 2016 03:40
Can anyone help me finish the first React challenge?
Kevin
@KevinBruland
Mar 21 2016 03:40
the white font on the blue background appears bolder and I can't figure out why. I have found stuff referencing anti-aliasing, but I can't figure out if thats fixable
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:41
@nsieber I haven't get there yet. but you should post your code. to see what you're doing@
Kevin
@KevinBruland
Mar 21 2016 03:42
@dadams-510 I want them to look the same degree of boldness
Ali
@livethehapylife
Mar 21 2016 03:42
Can someone explain why coding is so challenging
DJ
@qualitymanifest
Mar 21 2016 03:43
because you're learning a whole new language and way of thinking
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:43
@livethehapylife maybe because we are trying to read it like the same way we read english. when code is meant to concise and abstract! is learning to think in a different way!
Tia Holiday
@tlholiday
Mar 21 2016 03:43
@livethehapylife because it's not something you can exactly bullshit and you're literally learning a language and have to think critically and pragmatically about what you're doing.
James Beem
@beem812
Mar 21 2016 03:43
is there something i need to do on codepen to get the code in the js box to actually function on my page? I can't replicate any of the js code exercises on codepen
Ali
@livethehapylife
Mar 21 2016 03:44
@tlholiday this shit is too much to start at i wish i could bs it
DJ
@qualitymanifest
Mar 21 2016 03:44
@beem812 thats kinda vague... can you paste your pen
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:44
@livethehapylife RELAX
Ali
@livethehapylife
Mar 21 2016 03:44
@intelligentspaz3 coding is hard to learn
Kevin
@KevinBruland
Mar 21 2016 03:44
@beem812 yes, did you add jquery?
James Beem
@beem812
Mar 21 2016 03:45
thats probably it
ill try and check back
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:45
what isn't hard to learn
Kevin
@KevinBruland
Mar 21 2016 03:45
same way as adding bootstrap @beem812 , you just have to manually do it
Jared Pranke
@EtherWolf
Mar 21 2016 03:45
@livethehapylife Programs have lots of abstractions, the people that write the languages excusably lack foresight, it employs logic, the people that want to give you advice have poor social skills...and have comp sci degrees.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:45
guys. it is easier than you think! tedious at first though
Ali
@livethehapylife
Mar 21 2016 03:46
@EtherWolf just its a bit much im taking programming classes online and i feel so lost likei cant grab the concept
Darrel Adams
@dadams-510
Mar 21 2016 03:46
@livethehapylife You got this!
@livethehapylife programming isn't some type of an elite club, anyone can learn how to code.
@Benalron, I see what you're saying.
Kevin
@KevinBruland
Mar 21 2016 03:47
I found this site:
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:48
@livethehapylife Just Quit
Darrel Adams
@dadams-510
Mar 21 2016 03:48
Why do you need to have it slightly bolder? I can't really tell the difference but maybe my eyes are getting older haha
Jared Pranke
@EtherWolf
Mar 21 2016 03:48
@livethehapylife It takes time. You have to be dedicated to really OWN the concepts you are learning. Don't feel bad or doubt yourself if you don't grasp a concept the first time around. The most important part is that you keep trying. Eventually you will get it.
Kevin
@KevinBruland
Mar 21 2016 03:48
just a knowledge thing mostly... I don't like the way the white font looks being bolder... I want a thin style font
Ali
@livethehapylife
Mar 21 2016 03:48
@dadams-510 yes its pretty challenging to learn, i feel like i should have taken classes not just online
Kevin
@KevinBruland
Mar 21 2016 03:48
I like the colors, but that extra thickness is bad enough
Ali
@livethehapylife
Mar 21 2016 03:49
@EtherWolf i hope i will eventually get it
Darrel Adams
@dadams-510
Mar 21 2016 03:49
@livethehapylife, taking a class will help but it's not necessary.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:49
You'll never get it. it's only for smart people
Ali
@livethehapylife
Mar 21 2016 03:49
@intelligentspaz3 stfu
@dadams-510 well most places only hire if you have a degree
Darrel Adams
@dadams-510
Mar 21 2016 03:49
@livethehapylife is there something you're working on in FreeCodeCamp right now?
Tia Holiday
@tlholiday
Mar 21 2016 03:49
@livethehapylife psft girl I feel that!! But with practice it will become easier. It's overwhelming and that's why sometimes you have to dig deep. Take a couple days to take a break and go right back at it. Anyone really can learn, but you have to get your mind around the the conceptual aspect and applied aspect of it. Baby steps :)
Cass
@chunkylow
Mar 21 2016 03:50

var power = function(base, exponent) {
var result = 1;
for (var count = 0; count < exponent; count++) {
result *= base;
console.log(result);}
return "the answer is " + result;
};

console.log(power(2,3));

Ali
@livethehapylife
Mar 21 2016 03:50
@dadams-510 not now im doing homework for my web class
Darrel Adams
@dadams-510
Mar 21 2016 03:50
Ah okay. @livethehapylife
Cass
@chunkylow
Mar 21 2016 03:50
does anyone know how to display the base and exponent?
Ali
@livethehapylife
Mar 21 2016 03:50
@tlholiday i just gotta get the concet and im having trouble with that
Cass
@chunkylow
Mar 21 2016 03:50

something like var base
var exponent
var power = function(base, exponent) {
var result = 1;
for (var count = 0; count < exponent; count++) {
result *= base;
console.log(result);}
return base + " to the power of " + exponent " is " + result;
};

console.log(power(2,3));

Tia Holiday
@tlholiday
Mar 21 2016 03:50
@intelligentspaz3 this is not a place to be an ass dude. You can live in your ivory tower of ease and such, but for noobs it is overwhelming and intimidating. This is called /help not /imbetterthanyou
Darrel Adams
@dadams-510
Mar 21 2016 03:51
@livethehapylife keep at it honestly. I'm not a professional developer, just do it for fun but coding has definitely helped me understand problems and break them down.
@livethehapylife It also has helped me in my profession so coding is useful even if you don't have a degree in it.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:51
@tlholiday take or leave it
Ali
@livethehapylife
Mar 21 2016 03:51
@dadams-510 i wish it was for fun aha ive build 3 websites and slowly getting better but when using ems is where it confuesses me
Jared Pranke
@EtherWolf
Mar 21 2016 03:52
@livethehapylife For web development, self teaching is the way to go. The technologies used in the web are constantly evolving, and by the time you would graduate from a program your knowledge and skills will practically be deprecated.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:52
take it or leave it
Tia Holiday
@tlholiday
Mar 21 2016 03:52
@livethehapylife For me I get the overall concept, but the little things I miss frequently. Most def teaches you patience. Lol.
Ali
@livethehapylife
Mar 21 2016 03:52
@EtherWolf agreed but just need that paper at the end of the day to say i know how, with the degree you get paid better than without
Darrel Adams
@dadams-510
Mar 21 2016 03:52
@tlholiday @livethehapylife LOL coding definitely helps teach you life skills.
patience is one of those skills.
Ali
@livethehapylife
Mar 21 2016 03:53
@tlholiday im slowly getting there i think lol
Jared Pranke
@EtherWolf
Mar 21 2016 03:53
@livethehapylife Just dont major in web development, something more fundamental like comp sci would be a greater benefit. What you want to do with your life is also important. For example: If you like business you could opt for a BTM program or something etc.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:54
post your code. ask questions. what are you doing right or wrong. try it one way. if it doesn't work try it another way. have fun learning
Ali
@livethehapylife
Mar 21 2016 03:54
@EtherWolf i was thinking for becoming a programmer and working for google right now im working on getting an internship with them
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:54
don't focus too much in learning to code but solving problems
Darrel Adams
@dadams-510
Mar 21 2016 03:54
@livethehapylife We are here to help if you have questions.
Ali
@livethehapylife
Mar 21 2016 03:55
@dadams-510 thanks!
CamperBot
@camperbot
Mar 21 2016 03:55
livethehapylife sends brownie points to @dadams-510 :sparkles: :thumbsup: :sparkles:
:star: 316 | @dadams-510 | http://www.freecodecamp.com/dadams-510
Tia Holiday
@tlholiday
Mar 21 2016 03:55
@livethehapylife You'll get there!! Keep at it day by day and it'll come to you easier with each day that passes. Also, as a random tip, saying the code out loud as you type it has helped me. Tip I got from my brother who's also self-taught and working in tech!
Ali
@livethehapylife
Mar 21 2016 03:56
@tlholiday that sounds like a really good idea tbh i'll try it thanks!
CamperBot
@camperbot
Mar 21 2016 03:56
livethehapylife sends brownie points to @tlholiday :sparkles: :thumbsup: :sparkles:
:star: 75 | @tlholiday | http://www.freecodecamp.com/tlholiday
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 03:58
hello nerds
Nikov
@nsieber
Mar 21 2016 03:59
is anyone else having trouble posted their code with markdown? ie ''' code '''
CamperBot
@camperbot
Mar 21 2016 03:59
:bulb: to format code use backticks! ``` more info
Tia Holiday
@tlholiday
Mar 21 2016 03:59
@nsieber yea! I was earlier!!
Jared Pranke
@EtherWolf
Mar 21 2016 04:00
This message was deleted
Ali
@livethehapylife
Mar 21 2016 04:00
does anyone suggest a certain code user, like notepad or sublime orect, which is better?
Jared Pranke
@EtherWolf
Mar 21 2016 04:01
I like sublime, Some people prefer Atom.
Ali
@livethehapylife
Mar 21 2016 04:02
whats the difference?
DJ
@qualitymanifest
Mar 21 2016 04:04
no problem here
cbot provided a helpful hint there, regarding the backticks. you're using single quotes
CamperBot
@camperbot
Mar 21 2016 04:04
you called?
Tia Holiday
@tlholiday
Mar 21 2016 04:06
On the first responsive design with bootstrap challenge; can someone give me an example of what nesting a div container-fluid looks like? * :worried:
Jared Pranke
@EtherWolf
Mar 21 2016 04:07
@livethehapylife Not much, Atom is open source has lots of addons,...but so does sublime. Really it all comes down to the sublime free version prompting you to pay for it every now and then.
Ali
@livethehapylife
Mar 21 2016 04:08
@EtherWolf should i but it or just free version?
Tia Holiday
@tlholiday
Mar 21 2016 04:08

This is what I have...but I feel like it's way wrong
'''

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

CamperBot
@camperbot
Mar 21 2016 04:08
:bulb: to format code use backticks! ``` more info
DJ
@qualitymanifest
Mar 21 2016 04:09
@tlholiday
<nest>
    <bird>
    </bird>
</nest>
in this case the nest is a div with the class container-fluid... the birds are the rest of your HTML
Shana Marie
@shanabosshill
Mar 21 2016 04:10
great example @qualitymanifest
martinwayne
@martinwayne
Mar 21 2016 04:10
Hi everyone, I'm new here. I'm doing the first project with recreating the Borlaug page and I'm having trouble aligning my bullet points with the list item. I've tried searching the web but I haven't found anything that I'm confident is the solution. Any help in any right direction would be appreciated.
Jared Pranke
@EtherWolf
Mar 21 2016 04:10
@livethehapylife Well it's up to you. An individual built sublime so maybe paying for it is the "right" thing to do. Just make sure you try before you buy.
DJ
@qualitymanifest
Mar 21 2016 04:10
thanks. can't remember where i saw it first, but i thought it was pretty good
Ali
@livethehapylife
Mar 21 2016 04:10
@EtherWolf i like the quote lol
MahmoudHussain
@MahmoudHussain
Mar 21 2016 04:10
stuck in "35"
How to do this "Nest your text field in a form element"?
Jared Pranke
@EtherWolf
Mar 21 2016 04:11
@livethehapylife Exactly, still haven't payed for sublime. Not convinced enough ;)
Ali
@livethehapylife
Mar 21 2016 04:11
@EtherWolf ahaha understandable
Tia Holiday
@tlholiday
Mar 21 2016 04:12
@qualitymanifest so how far off is mine...<div container-fluid <h2 class="red-text">CatPhotoApp</h2> </div>
Manish Giri
@Manish-Giri
Mar 21 2016 04:12
@tlholiday here’s a general structure, you’ll be able to see what’s wrong with your code
<div class=“container-fluid”>
<h2></h2>
</div>
Jared Pranke
@EtherWolf
Mar 21 2016 04:13
@tlholiday I did that lesson ages ago but you usually have to attribute things like "container-fluid" as a class in bootstrap.
DJ
@qualitymanifest
Mar 21 2016 04:13
@tlholiday <div container-fluid you're missing the class="class name goes here" assignment, and a closing > there
@tlholiday if <h2 class="red-text">CatPhotoApp</h2> is all your HTML, then you just need to fix your opening div tag like i mentioned above
Manish Giri
@Manish-Giri
Mar 21 2016 04:14
@MahmoudHussain
<form action=“….”>
<input type=“….”>
</form>
MahmoudHussain
@MahmoudHussain
Mar 21 2016 04:14
This message was deleted
DJ
@qualitymanifest
Mar 21 2016 04:15
@tlholiday if that doesn't make sense, paste the URL to your challenge and i'll take a look
MahmoudHussain
@MahmoudHussain
Mar 21 2016 04:15
@Manish-Giri done thanks
CamperBot
@camperbot
Mar 21 2016 04:15
mahmoudhussain sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star: 794 | @manish-giri | http://www.freecodecamp.com/manish-giri
Tia Holiday
@tlholiday
Mar 21 2016 04:16
@qualitymanifest what you just typed made sense...except I'm still getting an error...
nevermind I got it @qualitymanifest
Thank you @Manish-Giri & @qualitymanifest much appreciated!
CamperBot
@camperbot
Mar 21 2016 04:19
tlholiday sends brownie points to @manish-giri and @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 795 | @manish-giri | http://www.freecodecamp.com/manish-giri
:star: 1090 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
DJ
@qualitymanifest
Mar 21 2016 04:19
glad to hear :+1:
Wise
@WiseNN
Mar 21 2016 04:40
Anyone here that can help with a quick question?
DJ
@qualitymanifest
Mar 21 2016 04:41
i'm sure somebody can. just ask the question
David Young
@dayvidwhy
Mar 21 2016 04:41
dont ask to ask
just ask
DJ
@qualitymanifest
Mar 21 2016 04:41
@deedubwhy tax
CamperBot
@camperbot
Mar 21 2016 04:41
qualitymanifest sends brownie points to @deedubwhy :sparkles: :thumbsup: :sparkles:
:star: 360 | @deedubwhy | http://www.freecodecamp.com/deedubwhy
Wise
@WiseNN
Mar 21 2016 04:45
Screen Shot 2016-03-21 at 12.44.33 AM.png
Ok, working on the tribute project and I am trying to bootstrap some images beside each other. They are cutting eachother off though:
DJ
@qualitymanifest
Mar 21 2016 04:47
@WiseNN if you're doing this project on codepen, just paste a link to the pen
Wise
@WiseNN
Mar 21 2016 04:47
Screen Shot 2016-03-21 at 12.46.30 AM.png
Ok ...
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 04:47
greetings from Chicago, IL
ebarras
@ebarras
Mar 21 2016 04:49
I'm running this first tutorial in Chrome for OSX, and I'm getting some really bad behavior. Is this typical?
Cool Geek
@lovelikeme
Mar 21 2016 04:50
@intelligentspaz3 me too. Especially the cat app border task
Wise
@WiseNN
Mar 21 2016 04:51
updated code pen http://codepen.io/WiseNN/pen/MypEJY …the photos keep overlapping. Not sure what to do
DJ
@qualitymanifest
Mar 21 2016 04:51
@WiseNN you could add the class img-responsive to each <img>
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 04:51
cool we should get code sometime
@lovelikeme
code
Cool Geek
@lovelikeme
Mar 21 2016 04:52
?
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 04:52
i said we should code together sometime
Cool Geek
@lovelikeme
Mar 21 2016 04:53
yeah. I'm down. I'm teaching a workshop on Saturday.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 04:53
really where?
Wise
@WiseNN
Mar 21 2016 04:53
@qualitymanifest tried, that doesnt work (updated) http://codepen.io/WiseNN/pen/MypEJY .
DJ
@qualitymanifest
Mar 21 2016 04:54
@WiseNN img-responsive not img-response
Francis
@Francis-p
Mar 21 2016 04:54
anyone done with random quote machine?
Cool Geek
@lovelikeme
Mar 21 2016 04:54
anyone have issue with cat app borders & pixel?
DJ
@qualitymanifest
Mar 21 2016 04:55
@Francis-p yes
@lovelikeme paste the URL to the challenge
Francis
@Francis-p
Mar 21 2016 04:55
@qualitymanifest where do you get the quote from?
DJ
@qualitymanifest
Mar 21 2016 04:55
@Francis-p i didn't use an API, i made an array of quotes
Wise
@WiseNN
Mar 21 2016 04:56
@lovelikeme if you are in safari, try switching browsers. Not an expert, but it fixed some of my problems.
Cool Geek
@lovelikeme
Mar 21 2016 04:56
thks
DJ
@qualitymanifest
Mar 21 2016 04:56
@Francis-p plenty of time to learn about API's later
Cool Geek
@lovelikeme
Mar 21 2016 04:56
browser issues ruin at least 90 min outta my day daily smdh
DJ
@qualitymanifest
Mar 21 2016 04:56
@lovelikeme that code passes for me. are you sure your browser is at 100% zoom?
@lovelikeme what browser do you use?
Cool Geek
@lovelikeme
Mar 21 2016 04:57
yep 100%
Chrome
DJ
@qualitymanifest
Mar 21 2016 04:57
@lovelikeme try refreshing the page and pasting that code there again. if that doesn't work (it should) try using a different browser
Francis
@Francis-p
Mar 21 2016 04:58
@qualitymanifest frankly speaking, i don’t understand API and Ajax lesson
Wise
@WiseNN
Mar 21 2016 04:58
@qualitymanifest My apologies. Ive tried that, but then the photos become unlevel with white space between them.
@lovelikeme good deal
Cool Geek
@lovelikeme
Mar 21 2016 04:59
refresh worked
Wise
@WiseNN
Mar 21 2016 05:00
@qualitymanifest updated http://codepen.io/WiseNN/pen/MypEJY
DJ
@qualitymanifest
Mar 21 2016 05:01
@Francis-p if you're doing the quote challenge, you really don't need to worry about that yet. you can just use an array... [["firstquote", "author"], ["secondquote", "author"]] etc
@WiseNN put the bigger picture in the middle and it'll look fine
Tia Holiday
@tlholiday
Mar 21 2016 05:05
creating block element bootstraps and the error I'm getting is "Your button class should still have the class btn". Where did I go wrong here...
<button class="btn-block">Like</button>
DJ
@qualitymanifest
Mar 21 2016 05:06
@tlholiday class="btn btn-block"
Tia Holiday
@tlholiday
Mar 21 2016 05:07
Oooo gotcha. I initally tried that but put a "." between the btns! Thanks @qualitymanifest
CamperBot
@camperbot
Mar 21 2016 05:07
tlholiday sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:warning: tlholiday already gave qualitymanifest points
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:11
i need help with :Try giving your form, which now has the id attribute of cat-photo-form, a green background.

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

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

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

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

<div class="gray-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">

I already set the background color green but I don't get any advancement

or I can't get pass: Your form element should have the background-color of green. and it has already been set green
Francis
@Francis-p
Mar 21 2016 05:13
@qualitymanifest so we don’t have to meet any number of quote?
DJ
@qualitymanifest
Mar 21 2016 05:14
@Francis-p nope. you could have 2 if you really didn't care
LujunW
@LujunWeng
Mar 21 2016 05:15
@intelligentspaz3 maybe, you should change your class name gray-background to green-background :smile:
Francis
@Francis-p
Mar 21 2016 05:15
@qualitymanifest noted! thanks!
CamperBot
@camperbot
Mar 21 2016 05:15
francis-p sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 1094 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:16
allright let's give it a try
no
it doesn't work
LujunW
@LujunWeng
Mar 21 2016 05:18
@intelligentspaz3 ok. it says you should set the form's background to green
basically, you didn't meet this requirement according to your code
Angelo Villavicencio
@spaceziggy
Mar 21 2016 05:20
Yo, guys, mind if I ask a question?
Joseph
@revisualize
Mar 21 2016 05:20
@spaceziggy You just did.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:20
<form action="/submit-cat-photo" id="cat-photo-form" background-color:green>
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"
Angelo Villavicencio
@spaceziggy
Mar 21 2016 05:20
Another question then.
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:20
would that work
isn't that inside style
already
Jeff
@meankraken
Mar 21 2016 05:21
@intelligentspaz3 if you're going that route, you have to do style="background-color:green"
Joseph
@revisualize
Mar 21 2016 05:21
@spaceziggy Don't ask to ask questions. Just ask.
We're busy. Get to the point.
Stephen Zukowski
@zukethenuke
Mar 21 2016 05:21
Can someone please tell me why this is returning 'null'
function sumAll(arr) {
  function compareNumbers(a, b) {   //function to sort numbers properly
    return a - b;
  }

  var newArr = arr.sort(compareNumbers); //sort array so smallest number is first and largest number last
  var min = arr[0];
  var max = arr[1]; 
  var sum;

  for (i=min; i<max-1; i++) {  //use loop to add middle numbers to array
    newArr.push(i+1);  
  }  

  newArr.sort(compareNumbers);  //sort completed array
  //return newArr;
  //return newArr.length;

  for (i=0; i<newArr.length; i++) {
    sum = sum + newArr[i];
  }

  return sum;
}
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:22
hold on stinking little code
Angelo Villavicencio
@spaceziggy
Mar 21 2016 05:22

Sorry. First-timer.

It looks like you guys are helping someone else. I'll come back later.

Jeff
@meankraken
Mar 21 2016 05:22
@spaceziggy lol ziggy you're good, fire away with the question
LujunW
@LujunWeng
Mar 21 2016 05:23
@intelligentspaz3 add the class to form tag as your div tag
Jeff
@meankraken
Mar 21 2016 05:24
@zukethenuke can you try initializing sum to 0
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:25
<form class="green-background" action="/submit-cat-photo" id="cat-photo-form">
Wise
@WiseNN
Mar 21 2016 05:25
@intelligentspaz3 that doesnt help because I need to have them all directly beside each other the same size, full width
Stephen Zukowski
@zukethenuke
Mar 21 2016 05:25
That was it! Thanks @meankraken
CamperBot
@camperbot
Mar 21 2016 05:25
zukethenuke sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 325 | @meankraken | http://www.freecodecamp.com/meankraken
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:26
it says Do not give your form any class or style attributes.
so this would not work
i'm throwing myself out the window
Jeff
@meankraken
Mar 21 2016 05:27

@intelligentspaz3 then delete the greenbackground class and do

cat-photo-form {

background-color:green;

}

#cat-photo-form need the hashtag in front
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:30
background-color:green; inside form?
Tatyana
@twesttt
Mar 21 2016 05:30
in style tag
Jeff
@meankraken
Mar 21 2016 05:31
@intelligentspaz3 your form has the id called "cat-photo-form" so inside your <style> </style> tags, you can put
#cat-photo-form {
background-color:green;
}
Diego Alves
@Diffo777
Mar 21 2016 05:31
I need your help guys, Im a first-timer.
I can't turn my h2 element to red. What am I doing wrong?

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

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

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

Lance
@texas2010
Mar 21 2016 05:33
.red-text
not h2.red-text
Diego Alves
@Diffo777
Mar 21 2016 05:33
Thank you! :+1:
Jeff
@meankraken
Mar 21 2016 05:33
@Diffo777 made the same mistake when I first started, saying h2 .red-text actually will change any element with class red-text that's indented within a h2 element
LujunW
@LujunWeng
Mar 21 2016 05:34
@intelligentspaz3 could you provide your challenge url address
Lance
@texas2010
Mar 21 2016 05:34
is it work? @Diffo777
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:34
yes sir
Diego Alves
@Diffo777
Mar 21 2016 05:35
It did worked!
Lance
@texas2010
Mar 21 2016 05:35
@Diffo777 great.
anupriya-gupta
@anupriya-gupta
Mar 21 2016 05:35
Could anyone suggest good projects on java and dbms?
Greg
@grford15
Mar 21 2016 05:37
Wondering if anyone can help me here ? I am on the "Target the same element with multiple jQuery Selectors" exercise and I've put my code in, and when I run the test everything bar one is ticked off. I'm left with "Only add one class with each of your three selectors" ... Don't see what I'm doing wrong here ...?
LujunW
@LujunWeng
Mar 21 2016 05:38

@intelligentspaz3 it says you should use an id attribute to style an element.

@intelligentspaz3 your form has the id called "cat-photo-form" so inside your <style> </style> tags, you can put

#cat-photo-form {
background-color:green;
}
Abhisek Pattnaik
@abhisekp
Mar 21 2016 05:38
@intelligentspaz3 please check your PM from me immediately.
Jeff
@meankraken
Mar 21 2016 05:39
@grford15 hit us with your code
Greg
@grford15
Mar 21 2016 05:39
<script>
$(document).ready(function() {
$("button").addClass ("animated");
$(".btn").addClass ("shake");
$("#target1").addClass ("btn-primary");
});
</script>
DJ
@qualitymanifest
Mar 21 2016 05:40
@grford15 i think if you get rid of the space between addClass and the class added, it will pass
Tatyana
@twesttt
Mar 21 2016 05:40
I'm just involved in freeCodeCamp... and there are elemantary tasks. Is it possible to choose another level? don't want to waste time
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 05:40
@abhisekp yes Sir
Abhisek Pattnaik
@abhisekp
Mar 21 2016 05:41
@intelligentspaz3 :+1:
Tatyana
@twesttt
Mar 21 2016 05:41
there is map link .. but it opens the same current task
Greg
@grford15
Mar 21 2016 05:41
@qualitymanifest Thanks ! that sorted it.
CamperBot
@camperbot
Mar 21 2016 05:41
grford15 sends brownie points to @qualitymanifest :sparkles: :thumbsup: :sparkles:
:star: 1095 | @qualitymanifest | http://www.freecodecamp.com/qualitymanifest
Tatyana
@twesttt
Mar 21 2016 05:42
so .. sorry I've found map :)
Kevin
@KevinBruland
Mar 21 2016 05:44
is there a vertical version of text-center? I am having trouble finding a definitive answer
Jeff
@meankraken
Mar 21 2016 05:47
don't think there's a set way to do it, try line-height: height of the div in px.. or just mess with the padding
Kevin
@KevinBruland
Mar 21 2016 05:47
OK, thanks
I did not think there was, but wanted to double check.
Tmore23
@Tmore23
Mar 21 2016 05:50
Is there another way to put space between two divs other than putting an invisible block betwen them?
Jeff
@meankraken
Mar 21 2016 05:51
@Tmore23 why not change the margins?
novice84
@novice84
Mar 21 2016 05:53
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary">Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info">Info</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-danger">Delete</button>
</div>
</div>
Tmore23
@Tmore23
Mar 21 2016 05:53
@meankraken I'm going to try that. Thank you
CamperBot
@camperbot
Mar 21 2016 05:53
tmore23 sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 326 | @meankraken | http://www.freecodecamp.com/meankraken
novice84
@novice84
Mar 21 2016 05:55
why three div (each of nesting button) are nested in div with class "row"
Jeff
@meankraken
Mar 21 2016 05:55
@novice84 indicates they're all in the same bootstrap row, so each will be a column that takes up col-xs-4 space
novice84
@novice84
Mar 21 2016 05:57
but if remove the outermost div(with class "row") the layout of button wont get disturbed.so what is the need of this extra div?
Tmore23
@Tmore23
Mar 21 2016 05:58
@meankraken that did exactly what I needed to do!
Jeff
@meankraken
Mar 21 2016 05:59
@Tmore23 glad to hear it
@novice84 well for the most part you should have the class row as the parent of the columns, especially when there are multiple rows in the table
novice84
@novice84
Mar 21 2016 06:02
thanks @meankraken
CamperBot
@camperbot
Mar 21 2016 06:02
novice84 sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 327 | @meankraken | http://www.freecodecamp.com/meankraken
Wise
@WiseNN
Mar 21 2016 06:07
Does anyone know how to make 3 images resized equally sit beside one another full-width (bootstrap)? I am trying, but I can’t seem to get it work. http://codepen.io/WiseNN/pen/PNpOeP
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 06:07
moving along. coding is a matter of following directions and truly understanding what is being asked. a lesson I really need to learn!
greetings
Wise
@WiseNN
Mar 21 2016 06:08
http://codepen.io/WiseNN/pen/PNpOeP im not sure why its showing up like this (stacked on top of eachother)
Jeff
@meankraken
Mar 21 2016 06:09
@WiseNN they're showing side by side for me
Traek Wells
@TraekWells
Mar 21 2016 06:09
Does anyone here NOT mockup the website in detail before jumping into coding it? Or, does everyone here do a detailed mockup first?
I mean detailed, not just concepts (which I feel is obvious before any project)
Jeff
@meankraken
Mar 21 2016 06:10
@TraekWells I just kinda jump right into it, but then again I haven't done any detailed full blown sites where I'm sure a general design would be necessary
@WiseNN one little trick you can do to horizontally align the pictures to the middle is
```
.img {
Traek Wells
@TraekWells
Mar 21 2016 06:13
@meankraken yeah man that makes sense. Normally I spend SO MUCH TIME (Maybe too much) doing the detailed mock up in Photoshop, then the coding goes somewhat fast. I’m asking because I think I can get more done with just a concept
Jeff
@meankraken
Mar 21 2016 06:13
.img {
margin:auto;
}
in your css
@TraekWells Im sure everyone has their own style, having a visual mockup for bigger projects definitely seems like a good idea though
Tmore23
@Tmore23
Mar 21 2016 06:16
question, we can add jquery to our portfolio pages correct?
minghanlee@utexas.edu
@wontonoodle
Mar 21 2016 06:17
hello meankraken
Jeff
@meankraken
Mar 21 2016 06:17
@wontonoodle how's it going
cannelflow
@cannelflow
Mar 21 2016 06:17
@Tmore23 yes
Tmore23
@Tmore23
Mar 21 2016 06:18
@cannelflow is there any reason why would it my script work inside of the editor view of codepen but not on the full view?
@cannelflow nvm I just linked the jquery cdn inside my page and it started to work
cannelflow
@cannelflow
Mar 21 2016 06:21
@Tmore23 :+1:
Alexander
@AlexHTML78
Mar 21 2016 06:25
Hello!
Can anyone help me?
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

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

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

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

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

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

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

  <img src="http://bit.ly/fcc-running-cats" class="img-responsive">

 <div class="row">

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

</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>
  <form action="/submit-cat-photo">
    <label><input type="radio" name="indoor-outdoor"> Indoor</label>
    <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
    <label><input type="checkbox" name="personality"> Loving</label>
    <label><input type="checkbox" name="personality"> Lazy</label>
    <label><input type="checkbox" name="personality"> Crazy</label>
    <input type="text" placeholder="cat photo URL" required>
    <button type="submit">Submit</button>
  </form>
</div>
Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Wise
@WiseNN
Mar 21 2016 06:26
@meankraken Im sorry, I dont believe I understand what you are saying
Jeff
@meankraken
Mar 21 2016 06:27
@AlexHTML78 hey, so you need your <button>s to be inside <div class="col-xs-4"> <button...></button> </div>
@WiseNN I was just saying you can put
.img {
margin:auto;
}
into your css to make your images horizontally centered in their columns, your images are showing up correctly on my screen otherwise
Alexander
@AlexHTML78
Mar 21 2016 06:30
@meankraken
Ty!
I did so, but for some reason did not work
Amit Kumar Singh
@aksinghdce
Mar 21 2016 06:30
I am new to FreeCodeCamp. I am loving it already. Trying to get past front-end development quickly to get to the real meat of the content.
I am working on a similar project like FreeCodeCamp and I love the fact that someone out there is already doing it.
Jeff
@meankraken
Mar 21 2016 06:31
@AlexHTML78 whats the error you're getting?
Amit Kumar Singh
@aksinghdce
Mar 21 2016 06:31
This couldn’t get better than this. Love open source :)
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:31
pleas hel me
Be sure to delete all trailing comment tags, i.e. -->.

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>
-->

what can i do?
Jeff
@meankraken
Mar 21 2016 06:32
@shaikhashikurrahman delete that last chunk "-->"
@aksinghdce agreed
Yash Kothari
@y2kkothari
Mar 21 2016 06:32

<Style>
h2 {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>

shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:33

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>

Yash Kothari
@y2kkothari
Mar 21 2016 06:33
stylesheet h2 declaration is valid with a semicolon and closing brace.
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:33
like this
Jeff
@meankraken
Mar 21 2016 06:33
@shaikhashikurrahman that should do it, are you still getting an error
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:34

Commenting is a way that you can leave comments within your code without affecting the code itself.

Commenting is also a convenient way to make code inactive without having to delete it entirely.

You can start a comment with <!-- and end a comment with -->

Uncomment your h1, h2 and p elements.

Run tests (ctrl + enter)
Reset Help Bug
Make your h1 element visible on your page by uncommenting it.
Make your h2 element visible on your page by uncommenting it.
Make your p element visible on your page by uncommenting it.
Be sure to delete all trailing comment tags, i.e. -->.

1
<!---->
2

<h1>Hello World</h1>
3

4

<h2>CatPhotoApp</h2>
5

6

<p>Hello Paragraph</p>
7

what is the problem
Jeff
@meankraken
Mar 21 2016 06:35
@shaikhashikurrahman err what's with the numbers? you need to delete everything with <!-- so delete that top one too
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:35
how
Jeff
@meankraken
Mar 21 2016 06:36
you see the <!----> at the top? that needs to go
Yash Kothari
@y2kkothari
Mar 21 2016 06:36
is the web page titled Uncomment Html @shaikhashikurrahman
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:37
yes
@y2kkothari yes
Yash Kothari
@y2kkothari
Mar 21 2016 06:37

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p>

paste this
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:37
@y2kkothari then
Yash Kothari
@y2kkothari
Mar 21 2016 06:38
press Ctrl+Enter
or Click Run Tests
@shaikhashikurrahman
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:39
@meankraken thanks for help
CamperBot
@camperbot
Mar 21 2016 06:39
shaikhashikurrahman sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 328 | @meankraken | http://www.freecodecamp.com/meankraken
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:39
@y2kkothari can not do
Yash Kothari
@y2kkothari
Mar 21 2016 06:40
can you access facebook??? @shaikhashikurrahman
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:40

@<!---->

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>

<p>Hello Paragraph</p> @y2kkothari

then what can i do
Yash Kothari
@y2kkothari
Mar 21 2016 06:41
Just Remove This From Your Code @shaikhashikurrahman
<!---->@shaikhashikurrahman
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 06:43
@y2kkothari thanks bro
CamperBot
@camperbot
Mar 21 2016 06:43
shaikhashikurrahman sends brownie points to @y2kkothari :sparkles: :thumbsup: :sparkles:
novice84
@novice84
Mar 21 2016 06:43
<div class="row">
<div class="col-xs-4"><label><input type="checkbox" name="personality"> Loving</label></div>
<div class="col-xs-4"><label><input type="checkbox" name="personality"> Lazy</label></div>
<div class="col-xs-4"><label><input type="checkbox" name="personality"> Crazy</label></div> </div> what is err in abve code.i am not getting label "Loving" inline with its checkbox.label "Loving"is showing below its respective checkbox.
CamperBot
@camperbot
Mar 21 2016 06:43
:star: 15 | @y2kkothari | http://www.freecodecamp.com/y2kkothari
Yash Kothari
@y2kkothari
Mar 21 2016 06:43
:sparkles: :+1: :sparkles: :
me-harmeek
@me-harmeek
Mar 21 2016 06:43
how to create div dynamically on button click with different id
Jeff
@meankraken
Mar 21 2016 06:44
@me-harmeek do you mean create a new div, or are you saying change the id of an existing div
me-harmeek
@me-harmeek
Mar 21 2016 06:44
@meankraken I need new div
@meankraken I need new div with new id
Jeff
@meankraken
Mar 21 2016 06:46
it really depends, you could just make a string with the html you want to add, then target the element you're changing and do $(blahblah).html(string) or .append(string)
you could make the div beforehand and hide it and then when you click the button, show that div
ermias777
@ermias777
Mar 21 2016 06:47
can someone help me with the thick-green-border step?
Gerardo Ramones
@GerardoRamones
Mar 21 2016 06:48
@me-harmeek you can try $(selector).html('<div id=newid>something</div>'); but it's tricky, dynamically added elements tend to get lost in DOM
me-harmeek
@me-harmeek
Mar 21 2016 06:48
@meankraken oky I try
Jeff
@meankraken
Mar 21 2016 06:49
@ermias777 not sure which that is, can you copy paste
me-harmeek
@me-harmeek
Mar 21 2016 06:50
@me-harmeek could you explain it more about that
ermias777
@ermias777
Mar 21 2016 06:50

@meankraken Create a class called thick-green-border that puts a 10-pixel-wide green border with a style of solid around an HTML element, and apply that class to your cat photo.

Remember that you can apply multiple classes to an element by separating each class with a space within its class attribute. For example:

.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
me-harmeek
@me-harmeek
Mar 21 2016 06:51
@meankraken could you explain it more about that
Jeff
@meankraken
Mar 21 2016 06:52
@ermias777 as far as the class declaration goes that looks right, did you apply the class to the element?
ermias777
@ermias777
Mar 21 2016 06:52
yes hold on ill show you @meankraken
Diego Alves
@Diffo777
Mar 21 2016 06:52

@ermias777 <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%;
}

Jeff
@meankraken
Mar 21 2016 06:53
@me-harmeek I think your best bet is to make the div with the id you want, style it and put whatever you want in it, then in the css do display:none, then on the jquery click, change the css to display:show
ermias777
@ermias777
Mar 21 2016 06:53
<img class="smaller-image" class="thick-green-border" src="https://bit.ly/fcc-relaxing-cat">
@meankraken
Jeff
@meankraken
Mar 21 2016 06:53
do class="smaller-image thick-green-border"
ermias777
@ermias777
Mar 21 2016 06:54
I tried that but it didn't work @Diffo777
okay thanks @meankraken
CamperBot
@camperbot
Mar 21 2016 06:54
ermias777 sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:star: 329 | @meankraken | http://www.freecodecamp.com/meankraken
Kevin
@KevinBruland
Mar 21 2016 06:54
is there a way to make a CSS style only apply to certain sizes of a col?
stathis lagos
@stathislag
Mar 21 2016 06:55
Hi all
Kevin
@KevinBruland
Mar 21 2016 06:55
I am trying to center text in a row, it looks how I want it to when it's side by side, but when they are stacked on top of each other, the extra space is not needed
me-harmeek
@me-harmeek
Mar 21 2016 06:56
@meankraken hey i got it http://jsfiddle.net/mjaric/tfflt/
Jeff
@meankraken
Mar 21 2016 06:57
@me-harmeek glad to hear, going to sleep now night all
ermias777
@ermias777
Mar 21 2016 06:58
@meankraken I got it and it worked tanks a lot and hahaha after an hour or so, i will
CamperBot
@camperbot
Mar 21 2016 06:58
ermias777 sends brownie points to @meankraken :sparkles: :thumbsup: :sparkles:
:warning: ermias777 already gave meankraken points
Gerardo Ramones
@GerardoRamones
Mar 21 2016 07:06
@Benalron try redefining your cols like .col-xs-2 { new styles }
Ivan Georgiev
@ivangeorgiew
Mar 21 2016 07:15
can I use dropbox for uploading .js or .css file and using it as a link?
Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 07:19
hi
help: please
CamperBot
@camperbot
Mar 21 2016 07:19

:point_right: algorithm no repeats please [wiki]

Problem Explanation:

  • This task requires us to look at each possible permutation of a string. This is best done using a recursion function. Being able to build a function which collects all permutations of a string is a common interview question, so there is no shortage of tutorials out there on how to do this, in many different code languages.
  • This task can still be daunting even after watching a tutorial. You will want to send each new use of the function 3 inputs: 1. a new string (or character array) that is being built, 2. a position in your new string that's going to be filled next, and 3. an idea of what characters (more specifically positions) from the original string have yet to be used. The pseudo code will look something like this:

    ```
    var str = ???;
    perm(current position in original string, what's been used in original string, current string build thus far){
    if(current string is finished) {
    print current string;
    }else{
    for(var i = 0; i < str.length; i++) {

    if(str[i] has not been used) {
      put str[i] into the current position;
      mark str[i] as used
      perm(current position in original string, what's been used in original string, current string build thus far)
      unmark str[i] as used because another branch in the tree for i + 1 will still likely use it;
    }

    }
    }
    }
    :pencil: read more about algorithm no repeats please on the FCC Wiki

Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 07:19

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

</style>

<h1>Hello World</h1>

Give your body element the color property of green.
Your h1 element should inherit the color green from your body element.
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:24
You need 2 p elements with Kitty Ipsum text.
Make sure each of your p elements has a closing tag.
Your p element should contain the first few words of the provided additional kitty ipsum text.
Do not add a class attribute to the second p element, without removing it from the first one.
Give elements with the p tag a font-size of 16px. Browser and Text zoom should be at 100%.
the code is

<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>
h1 {
font-size: 30px;
}
<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.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>

what is the problem? pleas help me
Gerardo Ramones
@GerardoRamones
Mar 21 2016 07:25
@intelligentspaz3 try color: green instead of background, I think thats the idea. With H1 inside a BODY tag, color must be the same
@shaikhashikurrahman H1 style is misplaced
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:26
@y2kkothari

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

1

<style>

Rodolfo Emmanuel
@intelligentspaz3
Mar 21 2016 07:26
thanks @gerardoramones
CamperBot
@camperbot
Mar 21 2016 07:26
intelligentspaz3 sends brownie points to @gerardoramones :sparkles: :thumbsup: :sparkles:
:star: 143 | @gerardoramones | http://www.freecodecamp.com/gerardoramones
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:26

@shaikhashikurrahman <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>
h1 {
font-size: 30px;
}
<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.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>

this is the code then what is the problem
Gerardo Ramones
@GerardoRamones
Mar 21 2016 07:30
@shaikhashikurrahman I think you need to add a p {font-size: 16px;} between <style> tags
and remove the class="red-text" to the second <P>
Tmore23
@Tmore23
Mar 21 2016 07:33
hey guys could you tell me why my page keeps reloading when I click the "learn more" button? and how do I stop it from doing so? http://codepen.io/Tmore23/full/xVgaNE/
Colton Colcleasure
@rocksynth
Mar 21 2016 07:33
@Tmore23 I can probably guess already, haha. Lemme look.
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:35
@gerardoramones yes
martinwayne
@martinwayne
Mar 21 2016 07:35
Hey everyone. Could anyone let me know why any text I put into the jumbotron becomes a link? http://codepen.io/martinjr/pen/pyedaw
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:35
but this
Colton Colcleasure
@rocksynth
Mar 21 2016 07:35
@Tmore23 Try removing the href="".
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:35
Give elements with the p tag a font-size of 16px. Browser and Text zoom should be at 100%.
Tmore23
@Tmore23
Mar 21 2016 07:35
@rocksynth from? o.O
Colton Colcleasure
@rocksynth
Mar 21 2016 07:35
@Tmore23 <a href="" data-box="page">Learn More</a>
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:36
@rocksynth yes but this
Colton Colcleasure
@rocksynth
Mar 21 2016 07:36
Try @Tmore23 <a href="#" data-box="page">Learn More</a> or <a data-box="page">Learn More</a>
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 07:36
@shaikhashikurrahman Give elements with the p tag a font-size of 16px. Browser and Text zoom should be at 100%.
Tmore23
@Tmore23
Mar 21 2016 07:36
@rocksynth I saw it thank you! Also how is it looking? any pointers?
CamperBot
@camperbot
Mar 21 2016 07:36
tmore23 sends brownie points to @rocksynth :sparkles: :thumbsup: :sparkles:
:star: 19 | @rocksynth | http://www.freecodecamp.com/rocksynth
Gerardo Ramones
@GerardoRamones
Mar 21 2016 07:36
@martinwayne line 16... missed </a>
Colton Colcleasure
@rocksynth
Mar 21 2016 07:37
@Tmore23 You don't want my pointers, buddy. ;)
martinwayne
@martinwayne
Mar 21 2016 07:37
@gerardoramones Thank you so much!
CamperBot
@camperbot
Mar 21 2016 07:37
martinwayne sends brownie points to @gerardoramones :sparkles: :thumbsup: :sparkles:
:star: 144 | @gerardoramones | http://www.freecodecamp.com/gerardoramones
Tmore23
@Tmore23
Mar 21 2016 07:37
@rocksynth how so
? lol
Colton Colcleasure
@rocksynth
Mar 21 2016 07:38
@Tmore23 I'll tell you, you're doing well. I have been a designer for 10 years, though, and tend to pick on design even though I am fully aware that this isn't Free Design Camp. Haha, you're code is going well. It looks like you've got this in the bag. I applaud you.
Malin Sundin
@MaoMaolin
Mar 21 2016 07:45
what i lerned from yesterday: Hate pictures
Tmore23
@Tmore23
Mar 21 2016 07:52
@rocksynth haha thank you. Any tips on getting better on the design aspect?
CamperBot
@camperbot
Mar 21 2016 07:52
tmore23 sends brownie points to @rocksynth :sparkles: :thumbsup: :sparkles:
:warning: tmore23 already gave rocksynth points
Colton Colcleasure
@rocksynth
Mar 21 2016 07:53
@Tmore23 No no. No tips there, it will slow down your progress in coding. Your focus is on the code, as it should be! Don't get caught up worrying about making it visually appealing, it will eat up so much of your time.
Tmore23
@Tmore23
Mar 21 2016 07:56
@rocksynth I've seen. Just making the page look as it does so far (as simple as it is) took about 60% of my time so far. But I'll take your advice and focus on the code. Once I get a better grasp of it I'll give the visuals a look.
Malin Sundin
@MaoMaolin
Mar 21 2016 08:03
is it possible 2 use a picture as backround in a big thumbnail and write text in it?
with html/css?
i dont know how i search that on google :P
Adrian
@TheAner123
Mar 21 2016 08:04
Yes
Malin Sundin
@MaoMaolin
Mar 21 2016 08:04
wait i htink i found it
Sameer Shamsudeen
@sameershamsudheen
Mar 21 2016 08:04
hello friends do you use all WAI-ARIA roles in your html5 website, is that important, which are the main roles you use regularly
Adrian
@TheAner123
Mar 21 2016 08:05
Why you want to use bootstrap?
Malin Sundin
@MaoMaolin
Mar 21 2016 08:05
@TheAner123 cause its my tribute page
and im a n00b so i cant do anything advanced yet
Santak Mishra
@santakmishra
Mar 21 2016 08:05
@MaoMaolin yes. you can use the CSS background property to set the background image of a div box and put text in it using html as you regularly do.
Malin Sundin
@MaoMaolin
Mar 21 2016 08:05
and that website didnt help me sadly
@santakmishra ah thats awesome
for text over image
Adrian
@TheAner123
Mar 21 2016 08:07
body {
background-image: url("paper.gif");
background-color: #cccccc;
}
Malin Sundin
@MaoMaolin
Mar 21 2016 08:07
thanks alot! @TheAner123 @lpix @santakmishra
CamperBot
@camperbot
Mar 21 2016 08:07
maomaolin sends brownie points to @theaner123 and @lpix and @santakmishra :sparkles: :thumbsup: :sparkles:
:star: 307 | @lpix | http://www.freecodecamp.com/lpix
:star: 92 | @theaner123 | http://www.freecodecamp.com/theaner123
:star: 355 | @santakmishra | http://www.freecodecamp.com/santakmishra
Adrian
@TheAner123
Mar 21 2016 08:08
No problem :smile:
lpix
@lpix
Mar 21 2016 08:08
@MaoMaolin np :D
Colton Colcleasure
@rocksynth
Mar 21 2016 08:22
@Tmore23 I suggest you design in flat style. It depends on solid colors, nice typography, and and good spacing. It doesn't take a lot of thought to make it look nice. ;) It will save you time.
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 08:23
Give elements with the p tag a font-size of 16px. Browser and Text zoom should be at 100%.

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

</style>

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

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

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

what is the problem
You need 2 p elements with Kitty Ipsum text.
Make sure each of your p elements has a closing tag.
Your p element should contain the first few words of the provided additional kitty ipsum text.
Do not add a class attribute to the second p element, without removing it from the first one.
Give elements with the p tag a font-size of 16px. Browser and Text zoom should be at 100%.
the code is

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

</style>

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

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

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

lpix
@lpix
Mar 21 2016 08:27
@shaikhashikurrahman define the style for p, just like with h1
Alexander
@AlexHTML78
Mar 21 2016 08:27
WHAT I'M DOING WRONG?
task:Apply the btn-default class to each of your button elements
<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <div class="well">
       <button class="btn btn-defailt"> </button>
        <button class="btn btn-defailt"> </button>
        <button class="btn btn-defailt"> </button>
      </div>
    </div>
    <div class="col-xs-6">
      <div class="well">
        <button class="btn btn-defailt"> </button>
        <button class="btn btn-defailt"> </button>
        <button class="btn btn-defailt"> </button>
      </div>
    </div>
  </div>
</div>
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 08:27

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

</style>

like this
lpix
@lpix
Mar 21 2016 08:28
you need to define it for p ...so p{ your code }
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 08:28
where
@lpix where
lpix
@lpix
Mar 21 2016 08:29
between the style tags
order doesn't really matter
rphares
@rphares
Mar 21 2016 08:30
@AlexHTML78 , check the spelling of btn-default
Alexander
@AlexHTML78
Mar 21 2016 08:30
shit.
thx!!
i'm stupid
shaikh ashikur rahman
@shaikhashikurrahman
Mar 21 2016 08:31
@lpix please give me this code
lpix
@lpix
Mar 21 2016 08:32
@shaikhashikurrahman what would you write? get the feel for trial and error..you'll need it for later projects :)
@shaikhashikurrahman how's it going?
gnbvi68
@gnbvi68
Mar 21 2016 08:41
how to create an smaller image in image element can anybody to help
Martialis39
@Martialis39
Mar 21 2016 09:11
Hello! I could really use your help. I'm a beginner and I'm having big trouble getting this image to scale with the size of the screen. I added "max-width: 100%; height: auto; display:block;" but this makes it too small
@gnbvi68 Hey! Smaller as in you want it to be a specific size? You can do this = <img width="45" height="40" src="..... >
@gnbvi68 obviously you can change the width and height to whatever. Thats one way :)
jnwesley
@jnwesley
Mar 21 2016 09:25
Hi. I'm stuck at the lesson 'Link to External Pages with Anchor Elements'
anybody pls help
anything wrong with the below code?
<a href="http://freecatphotoapp.com"> cat photos </a>
Qpus
@Qpus
Mar 21 2016 09:28
everything is fine with that line @jnwesley
jnwesley
@jnwesley
Mar 21 2016 09:30
why is Run 'tests' not running? @Qpus
shall I put the full code?
Qpus
@Qpus
Mar 21 2016 09:31
put it
jnwesley
@jnwesley
Mar 21 2016 09:31

<link href="http://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>

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

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

<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
<a href="http://freecatphotoapp.com"> cat photos </a>

Qpus
@Qpus
Mar 21 2016 09:35
everything seems fine
have you done all tasks? see which one have a red cross
jnwesley
@jnwesley
Mar 21 2016 09:37
Your a element should have the anchor text of "cat photos".
You need an a element that links to http://freecatphotoapp.com
Blauelf
@Blauelf
Mar 21 2016 09:37
Tried reloading the page?
jnwesley
@jnwesley
Mar 21 2016 09:37
these are in red crosses
Qpus
@Qpus
Mar 21 2016 09:39
reload the page and do it all over again
Blauelf
@Blauelf
Mar 21 2016 09:39
Reloading the challenge often helps if your code is right. HTML challenges seem to crash frequently, as they are constantly re-evaluated, even in an inconsistent state. Also happens for JS challenges, but less frequently, as they are executed manually.
MahmoudHussain
@MahmoudHussain
Mar 21 2016 09:55

stucked in "40"

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

<p>Things cats love:</p>

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

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

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

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

"Your first radio button on your form should be checked by default."

i have already checked all !!! what is wrong with this?

Qpus
@Qpus
Mar 21 2016 09:59
<form action="/submit-cat-photo"> maybe this? try to remove /
BHARGAB
@MaxySpark
Mar 21 2016 10:24
@MahmoudHussain you don't have to checked the second radio button.
kanchan sharma
@mitskanchan
Mar 21 2016 10:25
Hello-world
BHARGAB
@MaxySpark
Mar 21 2016 10:26
@MahmoudHussain and remove checked attribute from last two checkbox
@mitskanchan hi
kanchan sharma
@mitskanchan
Mar 21 2016 10:33
hii..can u tell me how should i start my first assignment in html
ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 10:34
I am stuck in a condition which reads "You should have the same number of comment openers and closers." in "Use comments to clarify code"
Can anyone help?
This message was deleted
cannelflow
@cannelflow
Mar 21 2016 10:47
@ameyalfcdatar which exercise?
StasiekK
@StasiekK
Mar 21 2016 10:49
@ameyalfcdatar past Code here
Gdb91
@Gdb91
Mar 21 2016 10:50

I am having Trouble retrieving data from the Wikipedia API. I don't get an alert message with this code:

<p data-height="268" data-theme-id="0" data-slug-hash="WwpMxP" data-default-tab="js" data-user="Gdb91" class="codepen">See the Pen <a href="http://codepen.io/Gdb91/pen/WwpMxP/">Wikipedia Viewer</a> by Daniel Göschl (<a href="http://codepen.io/Gdb91">@Gdb91</a>) on <a href="http://codepen.io">CodePen</a>.</p>

<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 10:50
@StasiekK @cannelflow
StasiekK
@StasiekK
Mar 21 2016 10:51
@ameyalfcdatar do you have 2 comments opener and 2 closing ?
ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 10:51

@StasiekK @cannelflow
<!-- Only change code above this line.-->

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

cannelflow
@cannelflow
Mar 21 2016 10:52
@ameyalfcdatar you need only two -- on both side you have three ---
itaaa
@itaaaa
Mar 21 2016 10:53
stucked in level 44
cannelflow
@cannelflow
Mar 21 2016 10:53
you had like <!---Only change code above this line--->
do like <!--Only change code above this line-->
@ameyalfcdatar
StasiekK
@StasiekK
Mar 21 2016 10:53
@ameyalfcdatar delete dot in comment
cannelflow
@cannelflow
Mar 21 2016 10:54
@itaaaa name of exercise?
itaaa
@itaaaa
Mar 21 2016 10:54

Try giving your form, which now has the id attribute of cat-photo-form, a green background. this is what i did : <style>

cat-photo-element {

background-color: green;
}
</style>

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

cannelflow
@cannelflow
Mar 21 2016 10:55
#cat-photo-element {<===should be cat-photo-form
background-color: green;
}
@itaaaa
StasiekK
@StasiekK
Mar 21 2016 10:56
@itaaaa your id is cat-photo-form !
ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 10:56
@cannelflow Nope bro. I have two -- both sides.
@StasiekK I'vr tried. Not working out.
cannelflow
@cannelflow
Mar 21 2016 10:57
@ameyalfcdatar show your code try refreshing page
@itaaaa ?
Kenni Gandira Alamsyah
@kenniga
Mar 21 2016 10:59
hello everyone. Nice to meet all of you
I need some help :(
<script>
  // Only change code below this line.
  if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {
    $("#data").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
  });
}



  // Only change code above this line.
</script>
<div id = "data">
  <h4>You are here:</h4>

</div>
I still don't get it. Why it choose if function?
itaaa
@itaaaa
Mar 21 2016 11:00

<link href="http://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;
}

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

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

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

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

<div class="gray-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" id ="cat-photo-element">
<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>

Kenni Gandira Alamsyah
@kenniga
Mar 21 2016 11:00
I mean, why it using if function?
ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 11:00

@cannelflow
<!--Only change code above this line-->

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

StasiekK
@StasiekK
Mar 21 2016 11:00
@ameyalfcdatar try refreshing, if still nothing, try using another browser
Brendan Kinahan
@BKinahan
Mar 21 2016 11:01
@kenniga if (navigator.geolocation) ensures that navigator.geolocation has a value before continuing (any value will evaluate to true, and undefined will evaluate to false
Kenni Gandira Alamsyah
@kenniga
Mar 21 2016 11:01
well, my question was covered by that message :((((((
StasiekK
@StasiekK
Mar 21 2016 11:01
@itaaaa your element should have one ID
Brendan Kinahan
@BKinahan
Mar 21 2016 11:01
@kenniga sometimes geolocation is disabled by a browser or device, and running the code without the data can result in errors
Kenni Gandira Alamsyah
@kenniga
Mar 21 2016 11:02
@BKinahan so navigator.geolocation only works by if function?
itaaa
@itaaaa
Mar 21 2016 11:02
@StasiekK so i have to delete cat-photo-form id
Brendan Kinahan
@BKinahan
Mar 21 2016 11:02
@kenniga it can work without it, but that step prevents errors due to navigator.geolocation being undefined.
StasiekK
@StasiekK
Mar 21 2016 11:03
@itaaaa give challange name i check
Kenni Gandira Alamsyah
@kenniga
Mar 21 2016 11:03
well, it explain much
thanks @BKinahan
CamperBot
@camperbot
Mar 21 2016 11:03
kenniga sends brownie points to @bkinahan :sparkles: :thumbsup: :sparkles:
:star: 1118 | @bkinahan | http://www.freecodecamp.com/bkinahan
Brendan Kinahan
@BKinahan
Mar 21 2016 11:04
@kenniga no problem
itaaa
@itaaaa
Mar 21 2016 11:04
@StasiekK 44 "Use an ID Attribute to Style an Element"
StasiekK
@StasiekK
Mar 21 2016 11:06
@itaaaa you need to delete cat-photo-element
ameyalfcdatar
@ameyalfcdatar
Mar 21 2016 11:06
@StasiekK Thanks a lot. I was working on Google Chrome and when I swiched it to firefox , the problem got fixed. :)
CamperBot
@camperbot
Mar 21 2016 11:06
ameyalfcdatar sends brownie points to @stasiekk :sparkles: :thumbsup: :sparkles:
:star: 197 | @stasiekk | http://www.freecodecamp.com/stasiekk
StasiekK
@StasiekK
Mar 21 2016 11:07
@itaaaa and in style you need to have cat-photo-form
cannelflow
@cannelflow
Mar 21 2016 11:07
#cat-photo-element {<===should be #cat-photo-form
background-color: green;
}
@itaaaa
itaaa
@itaaaa
Mar 21 2016 11:08
@StasiekK thx
CamperBot
@camperbot
Mar 21 2016 11:08
itaaaa sends brownie points to @stasiekk :sparkles: :thumbsup: :sparkles:
:star: 198 | @stasiekk | http://www.freecodecamp.com/stasiekk
Rishabh Kashyap
@iamrkcheers
Mar 21 2016 11:09
Could anyone gimme an example of how to use a dead link.
StasiekK
@StasiekK
Mar 21 2016 11:10
href="#"
Rishabh Kashyap
@iamrkcheers
Mar 21 2016 11:10
<p>Click here for <a href="#">cat photos</a>
this is my code & it's not working.
StasiekK
@StasiekK
Mar 21 2016 11:10
Challenge name?
cannelflow
@cannelflow
Mar 21 2016 11:11
@iamrkcheers try rempveing p tag
Rishabh Kashyap
@iamrkcheers
Mar 21 2016 11:11
Make Dead Links using the Hash Symbol
<p>Click here for <a href="#">cat photos</a>.</p>
itaaa
@itaaaa
Mar 21 2016 11:12
@iamrkcheers close the paragraph at the end </p>
Rishabh Kashyap
@iamrkcheers
Mar 21 2016 11:12
this is my complete code.
i am.
but still it won't accept.
cannelflow
@cannelflow
Mar 21 2016 11:13
<p>Click here for <a href="#">cat photos</a>.</p>
working for me try refreshing page
@iamrkcheers
Robert Uivarosi
@URobert
Mar 21 2016 11:14
@iamrkcheers you have a . in there
Rishabh Kashyap
@iamrkcheers
Mar 21 2016 11:14
yeah.
Refreshing did the trick.
Thanks everyone.
Jan
@Jan-Viking
Mar 21 2016 11:15
hello
Robert Uivarosi
@URobert
Mar 21 2016 11:15
@iamrkcheers actually that doesn't metter ^^. I just realized you wanted to exclude the . from the link
@Jan-Viking hi
StasiekK
@StasiekK
Mar 21 2016 11:15
@Jan-Viking hello
Alon Bukai
@Alonski
Mar 21 2016 11:15
Hey friends.
Is there a simpler way to return a factorialized number than using a for loop?
function factorialize(num) {
  var factor = 1;
  for(i = 2; i <= num; i++) {
    factor *= i;
  }
  return factor;
}
Robert Uivarosi
@URobert
Mar 21 2016 11:16
@Alonski I used a for loop my self
StasiekK
@StasiekK
Mar 21 2016 11:17
@Alonski loop is good for this
Alon Bukai
@Alonski
Mar 21 2016 11:17
@URobert @StasiekK Wondering if there is a simpler or more effecient way. Thanks
CamperBot
@camperbot
Mar 21 2016 11:17
alonski sends brownie points to @urobert and @stasiekk :sparkles: :thumbsup: :sparkles:
:star: 717 | @urobert | http://www.freecodecamp.com/urobert
:star: 199 | @stasiekk | http://www.freecodecamp.com/stasiekk
Sudeep Biswas
@sudeepb02
Mar 21 2016 11:17
@Alonski You can try recursive functions
StasiekK
@StasiekK
Mar 21 2016 11:18
@Alonski its effecient way
Alon Bukai
@Alonski
Mar 21 2016 11:18
@sudeepb02 I could but that would be less effecient no?
David Young
@dayvidwhy
Mar 21 2016 11:18
@Alonski why do you think it is?