These are chat archives for FreeCodeCamp/Help

5th
Nov 2016
Emmanuel
@chriemma
Nov 05 2016 00:00
No
Pranay Kumar
@pranaykumar389
Nov 05 2016 00:00
Hi, Everyone!
I just completed My Random Quote Machine Project. Here is the link https://codepen.io/rudrapranaykumar/full/WGaZox
Please have a look, and I would like to get some feedback good or bad.
Keanu
@KeanuPlayer1
Nov 05 2016 00:00
hey guys, am i allowed to send my code in the chat here to get help?
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:01
<form action="/submit-cat-photo"id="cat-photo-app"></form> still not happy with this???
<form action="submit-cat-photo"id="cat-photo-app"></form>
__mifflin__
@cdrainxv
Nov 05 2016 00:01
@BatmansGoneFishing : cat-photo-form
Samuel Boczek
@instalab
Nov 05 2016 00:02
@pranaykumar389 Good project
Saltencoder
@Saltencoder
Nov 05 2016 00:02
p {
.font-size: 16px;
} what is wrong about that? ^^
Clyde Lobo
@oppiniated
Nov 05 2016 00:02
@Saltencoder remove . before .font-size
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:02
full face palm hahaha @cdrainxv
Pranay Kumar
@pranaykumar389
Nov 05 2016 00:02
@akacipher Thank you Samuel :-)
CamperBot
@camperbot
Nov 05 2016 00:02
pranaykumar389 sends brownie points to @akacipher :sparkles: :thumbsup: :sparkles:
:cookie: 66 | @akacipher |http://www.freecodecamp.com/akacipher
Keanu
@KeanuPlayer1
Nov 05 2016 00:02
my challenge is to override styles in subsequent css, is there anybody, who could show me my failure?
Devtogether
@Devtogether
Nov 05 2016 00:02
What is wrong with this? <p><a herf="http://freecatphotoapp.com">cat photos</a></p>
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:03
yea to much learning for one day haha have fun everyone. thanks @cdrainxv
CamperBot
@camperbot
Nov 05 2016 00:03
batmansgonefishing sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:warning: batmansgonefishing already gave cdrainxv points
Saltencoder
@Saltencoder
Nov 05 2016 00:03
@oppiniated its in <style>, forgot to say that
Clyde Lobo
@oppiniated
Nov 05 2016 00:04
@Saltencoder I know, you have a . before the font-size
Samuel Boczek
@instalab
Nov 05 2016 00:05
@Devtogether add "View more" between <p> and <a href>
@Devtogether Like that: <p>View more <a href="http://www.freecatphotoapp.com">cat photos</a></p>
U-ways
@U-ways
Nov 05 2016 00:05
@KeanuPlayer1 Hello! What I managed to spot: <h1 class= "pink-text" "blue-text" >Hello World!</h1> got a syntax error :D
When you want to add more than once class to your element you just put them inside the same double quotes and space them from each other. Example:
<h2 class="Class1 Class2 Class3">This is an H2 element!</h2>
Clyde Lobo
@oppiniated
Nov 05 2016 00:05
This message was deleted
Devtogether
@Devtogether
Nov 05 2016 00:05
What does view more do?
Gasaan James
@gasimjames
Nov 05 2016 00:06
I'm confused. I'm having trouble with kitty ipsum text. Help?
__mifflin__
@cdrainxv
Nov 05 2016 00:06
@pranaykumar389: Looks good… maybe include the twitter/tweet icon on the Tweet button and maybe even a shuffle icon on the New Quote button.
kennethlv13
@kennethlv13
Nov 05 2016 00:06
Heyyyy
How do make a comment under element to so that is not visible
Samuel Boczek
@instalab
Nov 05 2016 00:06
@Devtogether Nothing, they just want you to include "View more" before the anchor
Keanu
@KeanuPlayer1
Nov 05 2016 00:06
oh thank you @U-ways !!:-) got the challenge now (y)
CamperBot
@camperbot
Nov 05 2016 00:06
keanuplayer1 sends brownie points to @u-ways :sparkles: :thumbsup: :sparkles:
:cookie: 542 | @u-ways |http://www.freecodecamp.com/u-ways
__mifflin__
@cdrainxv
Nov 05 2016 00:07
@Devtogether: href not herf
kennethlv13
@kennethlv13
Nov 05 2016 00:07
<!-
Samuel Boczek
@instalab
Nov 05 2016 00:07
@cdrainxv Good spot!
Devtogether
@Devtogether
Nov 05 2016 00:07
Thanks @cdrainxv
CamperBot
@camperbot
Nov 05 2016 00:07
devtogether sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 722 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Nov 05 2016 00:07
@Devtogether : also missing text View more
Pranay Kumar
@pranaykumar389
Nov 05 2016 00:08
@cdrainxv Yeah! I 'll do that thank you for your suggestion. :-)
CamperBot
@camperbot
Nov 05 2016 00:08
pranaykumar389 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 723 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
U-ways
@U-ways
Nov 05 2016 00:08
@KeanuPlayer1 Goodluck :D
Devtogether
@Devtogether
Nov 05 2016 00:09
Why didn't they ask for view more before the a href within the assignment?
__mifflin__
@cdrainxv
Nov 05 2016 00:09
@akacipher: eagle eye here :bird: :smile:
@pranaykumar389: no problem :+1:
Walid Ashri
@walidashri
Nov 05 2016 00:10
@cdrainxv Good Evening Eagle
Raushanah
@Raushanah
Nov 05 2016 00:12
Challenge Use Responsive Design with Bootstrap Fluid Containers
__mifflin__
@cdrainxv
Nov 05 2016 00:12
@walidashri: Hey! 0/ …
Raushanah
@Raushanah
Nov 05 2016 00:12
Prob: Make sure you have nested all HTML elements in .container-fluid.
__mifflin__
@cdrainxv
Nov 05 2016 00:13
It’s Mr. Eagle to you. @walidashri :smile:
Erick Rodriguez
@erickrod54
Nov 05 2016 00:13
im doing that challenge @Raushanah need something bro?
Walid Ashri
@walidashri
Nov 05 2016 00:13
@Raushanah make sure u closed the container div
Raushanah
@Raushanah
Nov 05 2016 00:13

Code:<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 <h2 class="container-fluid">CatPhotoApp</h2>

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

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

<p>Things cats love:</p>

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

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

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

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

Walid Ashri
@walidashri
Nov 05 2016 00:14
@cdrainxv you mean ms eagle :D
Erick Rodriguez
@erickrod54
Nov 05 2016 00:14
the div that opens @Raushanah
kennethlv13
@kennethlv13
Nov 05 2016 00:14
HELP
Comment element so that is no visible?
Jordan Garcia
@jordeee
Nov 05 2016 00:14
Remove element target4 from the page by using the .remove() function.
anyone know how to do this
kennethlv13
@kennethlv13
Nov 05 2016 00:15
comment on h1 so that is not visible?
__mifflin__
@cdrainxv
Nov 05 2016 00:15
@walidashri:

Mr.

Raushanah
@Raushanah
Nov 05 2016 00:15
Guys, when I close it the div that opens I get an X
Walid Ashri
@walidashri
Nov 05 2016 00:15

Ms :P

kennethlv13
@kennethlv13
Nov 05 2016 00:15
<!-- Not visible-->?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:15
if you look the '>' of the div is missing @Raushanah
Raushanah
@Raushanah
Nov 05 2016 00:16

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

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

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

<p>Things cats love:</p>

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

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

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

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

kennethlv13
@kennethlv13
Nov 05 2016 00:16
Can anyone help lol
Emmanuel
@chriemma
Nov 05 2016 00:16
@Azbo400 have not hear from you again
__mifflin__
@cdrainxv
Nov 05 2016 00:16
@Raushanah: you want to nest everthing including the form.
Raushanah
@Raushanah
Nov 05 2016 00:16
Guys, when I close the div I get an "X" on Make sure your div element has a closing tag
Walid Ashri
@walidashri
Nov 05 2016 00:16
@Raushanah the class with div not h2
Saltencoder
@Saltencoder
Nov 05 2016 00:16

<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> doesnt work, did I miss something?

Raushanah
@Raushanah
Nov 05 2016 00:16
I need help with Make sure you have nested all HTML elements in .container-fluid.
zack
@acting2332
Nov 05 2016 00:17
Hey guys so my border radius needs to be 10px not sure how to add that elelment in?
Jordan Garcia
@jordeee
Nov 05 2016 00:17
@kennethlv13 above your h1 write <!-- then below it write -->
Erick Rodriguez
@erickrod54
Nov 05 2016 00:17

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

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

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

<p>Things cats love:</p>

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

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

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

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

Raushanah
@Raushanah
Nov 05 2016 00:17
@walid ?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:17
</div>
below the tag form @Raushanah
Walid Ashri
@walidashri
Nov 05 2016 00:18
@kennethlv13 <!-- <h2></h2>-->?
@Raushanah <div>
<h2 class="container-fluid">CatPhotoApp</h2> the div
Raushanah
@Raushanah
Nov 05 2016 00:18

Ive tried that as well....still wrong @erickrod54 </style>
<div <h2 class="container-fluid">CatPhotoApp</h2>

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

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

<p>Things cats love:</p>

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

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

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

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

Darre Zhou
@zhoukeeper
Nov 05 2016 00:18

i have a questions about "target the same element with multiple jQueary selectors" I have gotten this and the test says its correct:

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

except its not allowing my to pass because i didn't "only add one class with each of your three selectors.

HELP!

Erick Rodriguez
@erickrod54
Nov 05 2016 00:18

@Raushanah <div>

<h2 class="container-fluid">CatPhotoApp</h2>

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

<p>Things cats love:</p>

<ul>

<li>cat nip</li>

<li>laser pointers</li>

<li>lasagna</li>
</ul>

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

<ol>

<li>flea treatment</li>

<li>thunder</li>

<li>other cats</li>
</ol>

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

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

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

<label><input type="checkbox" name="personality"> Loving</label>

<label><input type="checkbox" name="personality"> Lazy</label>

<label><input type="checkbox" name="personality"> Crazy</label>

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

<button type="submit">Submit</button></div>
</form>
</div>

Saltencoder
@Saltencoder
Nov 05 2016 00:19

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

zack
@acting2332
Nov 05 2016 00:19
how do i add a 10px border radius?
Walid Ashri
@walidashri
Nov 05 2016 00:19
@Raushanah
<div class="container-fluid">
<h2 >CatPhotoApp</h2>
@acting2332 border-radius: 10px; in style
Raushanah
@Raushanah
Nov 05 2016 00:20
@walidashri and @erickrod54 thanks it worked guys
CamperBot
@camperbot
Nov 05 2016 00:20
:cookie: 79 | @erickrod54 |http://www.freecodecamp.com/erickrod54
:cookie: 572 | @walidashri |http://www.freecodecamp.com/walidashri
raushanah sends brownie points to @walidashri and @erickrod54 :sparkles: :thumbsup: :sparkles:
Raushanah
@Raushanah
Nov 05 2016 00:21

But look at the code </style>
<div <h2 class="container-fluid">CatPhotoApp</h2>

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

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

<p>Things cats love:</p>

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

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

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

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

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

No closing tag for the opening div
I closed the tag several trys but kept getting error
Walid Ashri
@walidashri
Nov 05 2016 00:22
@Raushanah r u sure this pass?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:22
@Raushanah the div tag of the container opens before tag style
Raushanah
@Raushanah
Nov 05 2016 00:22
Positive guys
Wish I could take a screen shot
All green checks with no closing tag
Danni
@Danibo26
Nov 05 2016 00:23
Trying to "create a class called smaller-image" and use it to resize.
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:23
hey if Im trying to input text
Danni
@Danibo26
Nov 05 2016 00:23

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

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
.smaller-image {width: 100px;
}
</style>

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

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

<p class="red-text">Kitty ipsum dolor sit amet,

Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:23
where am I going wrong <h1 input-text="hello world">
Emmanuel
@chriemma
Nov 05 2016 00:24
pls can someone help me with this challenge www.freecodecamp.com/challenges/add-font-awesome-icons-to-our-buttons#?solution=
Darre Zhou
@zhoukeeper
Nov 05 2016 00:24
.smaller-image {
__mifflin__
@cdrainxv
Nov 05 2016 00:24
@Raushanah: This is wrong though… it should be along the lines of:
<div class="…">
 <h2></h2>
  …..
 <form></form>
</div>
Walid Ashri
@walidashri
Nov 05 2016 00:25
@Danibo26 add the class to the img tag
Raushanah
@Raushanah
Nov 05 2016 00:25
Now the section indicating pass or fail is gone
Darre Zhou
@zhoukeeper
Nov 05 2016 00:25
@Danibo26 try <img src="smaller-image https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 00:25
ive done it"
Raushanah
@Raushanah
Nov 05 2016 00:25
It has to be a "bug"
Erick Rodriguez
@erickrod54
Nov 05 2016 00:25
ok @Danibo26 you can do it <img class="smaller-image"></img>
Walid Ashri
@walidashri
Nov 05 2016 00:25
@cdrainxv it passes
Raushanah
@Raushanah
Nov 05 2016 00:25
Ive refreshed several
adubiaro opeyemi
@Adubiaro
Nov 05 2016 00:26
hello guys.. am having issue with Target HTML Elements with Selectors Using jQuery challenge... can someone help me out pls
Nicolle1331
@Nicolle1331
Nov 05 2016 00:27
can someone help - idk where I'm going wrong with nesting the topmost ing element within a div
<div class="container-fluid">
<div class="row">
<div class="col-xs-8">
<h2 class="text-primary text-center">CatPhotoApp</h2>
</div>
<div class="col-xs-4>">
<img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
</div>
</div>
Erick Rodriguez
@erickrod54
Nov 05 2016 00:27
@Danibo26 check where you put the class.. the right place is in the img tag ... let me know when you get done
__mifflin__
@cdrainxv
Nov 05 2016 00:27
@walidashri: some one should file an issue… 1,2,3 … not me!
Devtogether
@Devtogether
Nov 05 2016 00:27
<form action="/sumbit-cat-photo"><input type="text" placeholder="/sumbit-cat-photo"></form> what is the thing I need to put ?
__mifflin__
@cdrainxv
Nov 05 2016 00:28
@Nicolle1331: everthing below your style tags should be nested in your div with class container-fluid
WhiteHatNoob
@WhiteHatNoob
Nov 05 2016 00:29
I have the same question with the container-fluid thing
Nicolle1331
@Nicolle1331
Nov 05 2016 00:29
@cdrainxv thats what i thought but when i click run tests i keep getting the error that they topmost ing isn't nested
__mifflin__
@cdrainxv
Nov 05 2016 00:29
@Devtogether: your value for placeholder is incorrect… it should be something like cat photo URL… i think
Devtogether
@Devtogether
Nov 05 2016 00:30
Never mind I didn't need the "" within" the form
WhiteHatNoob
@WhiteHatNoob
Nov 05 2016 00:30

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

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

</div>

how should I make this such as all elements are in container-fluid?
Raushanah
@Raushanah
Nov 05 2016 00:30

</style>

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

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

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

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

I re ran test and now the code is not working again
Danni
@Danibo26
Nov 05 2016 00:30

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

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
img .smaller-image {
width: 100px;
}
</style>

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

<p class="red-text">Kitty

WhiteHatNoob
@WhiteHatNoob
Nov 05 2016 00:31
@Raushanah thanks.
CamperBot
@camperbot
Nov 05 2016 00:31
whitehatnoob sends brownie points to @raushanah :sparkles: :thumbsup: :sparkles:
:cookie: 66 | @raushanah |http://www.freecodecamp.com/raushanah
Raushanah
@Raushanah
Nov 05 2016 00:31
<div>
<h2 class="container-fluid">CatPhotoApp</h2>

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

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

<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>
Walid Ashri
@walidashri
Nov 05 2016 00:31
@Danibo26 one img tag
Raushanah
@Raushanah
Nov 05 2016 00:31
Ive tried with leaving off and includinng opening tags
Still not working...
__mifflin__
@cdrainxv
Nov 05 2016 00:32
@WhiteHatNoob: remove this:.container-fluid{}container-fluid is a bootstrap class that has already been styled… you don’t need to style it further in this challenge… maybe later on on your own projects...
Nicolle1331
@Nicolle1331
Nov 05 2016 00:32
i am on #75 if that helps with my question
Walid Ashri
@walidashri
Nov 05 2016 00:32
@Danibo26
<img  class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
__mifflin__
@cdrainxv
Nov 05 2016 00:32
@Raushanah : :point_up: November 4, 2016 6:24 PM
Erick Rodriguez
@erickrod54
Nov 05 2016 00:32
nested <div class="container-fluid"></style>....... </form></div> @Raushanah
Usama Tahir
@Usama-Tahir
Nov 05 2016 00:32
anyone use Brackets here ?
WhiteHatNoob
@WhiteHatNoob
Nov 05 2016 00:32
@cdrainxv thank you very much
CamperBot
@camperbot
Nov 05 2016 00:32
whitehatnoob sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 724 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Raushanah
@Raushanah
Nov 05 2016 00:32
It has to be a bug with Use Responsive Design with Bootstrap Fluid Containers
Gasaan James
@gasimjames
Nov 05 2016 00:32
how do i add font size?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:33
nested <div class="container-fluid"></style>....... </form></div> @Raushanah
Emily Smith
@etsmith11
Nov 05 2016 00:33

<style>

class="smaller-image" {
width: 100px;

}

__mifflin__
@cdrainxv
Nov 05 2016 00:33
@erickrod54 : the style tags should not be in the div w/ container-fluid class.
Emily Smith
@etsmith11
Nov 05 2016 00:33
why will this not work, i think i have done it right butnothing happens
kennethlv13
@kennethlv13
Nov 05 2016 00:33
<style>
.blue-text {
color: blue;
}
</style>
Walid Ashri
@walidashri
Nov 05 2016 00:33
@etsmith11
<style>

.smaller-image{
    width: 100px;  

  }
__mifflin__
@cdrainxv
Nov 05 2016 00:34
@walidashri: "?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:34
there are bug ... just passed me @cdrainxv
jajaja
kennethlv13
@kennethlv13
Nov 05 2016 00:34
Your h2 element should have the class red-text.
what does this mean
Tre Reinhart
@treinhar
Nov 05 2016 00:34
why will this not work, i think i have done it right butnothing happens
Same here.
Walid Ashri
@walidashri
Nov 05 2016 00:34
@cdrainxv tired :(
kennethlv13
@kennethlv13
Nov 05 2016 00:34
hellurrr
anyone wanna help a newbie
Walid Ashri
@walidashri
Nov 05 2016 00:35
@kennethlv13 add the class inside the h2 tag
kennethlv13
@kennethlv13
Nov 05 2016 00:35
<style>
h2 {
color: red;
}
</style>
in here
Raushanah
@Raushanah
Nov 05 2016 00:35
@erickrod54 pls offer a screen shot
Michael
@webdemon1
Nov 05 2016 00:35
Morning, everyone
kennethlv13
@kennethlv13
Nov 05 2016 00:36
true
Emily Smith
@etsmith11
Nov 05 2016 00:36
@walidashri i tried that and it still isnt working
Walid Ashri
@walidashri
Nov 05 2016 00:36
check again there was a mistake @etsmith11
Raushanah
@Raushanah
Nov 05 2016 00:36

<div class="container-fluid" } </style>

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

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

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

<p>Things cats love:</p>

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

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

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

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

Tre Reinhart
@treinhar
Nov 05 2016 00:37
Screen Shot 2016-11-04 at 5.36.34 PM.png
Walid Ashri
@walidashri
Nov 05 2016 00:37
@etsmith11
<style>

.smaller-image{
    width: 100px;  

  }
adubiaro opeyemi
@Adubiaro
Nov 05 2016 00:37
Capture.JPG
Darre Zhou
@zhoukeeper
Nov 05 2016 00:37

i have a questions about "target the same element with multiple jQueary selectors" I have gotten this and the test says its correct:

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

except its not allowing my to pass because i didn't "only add one class with each of your three selectors.

I believe i have done this but its still no pass

Emily Smith
@etsmith11
Nov 05 2016 00:38

<style>

.smaller-image{
width: 100px;

}

am i doing something wrong?
Walid Ashri
@walidashri
Nov 05 2016 00:38
@etsmith11 add the class to the img tag
@treinhar try a refresh
adubiaro opeyemi
@Adubiaro
Nov 05 2016 00:39
can someone please help me with this challenge
Capture.JPG
kennethlv13
@kennethlv13
Nov 05 2016 00:39
file:///Users/patriciacastaneda/Desktop/Screen%20Shot%202016-11-04%20at%2020.37.16.png
Danni
@Danibo26
Nov 05 2016 00:39
@walidashri thank you. But after <img class="smaller-image" src="https://> where do you set it to resize to 100px?
CamperBot
@camperbot
Nov 05 2016 00:39
danibo26 sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 573 | @walidashri |http://www.freecodecamp.com/walidashri
adubiaro opeyemi
@Adubiaro
Nov 05 2016 00:39
how will i add animatedbounce to the buttons
Walid Ashri
@walidashri
Nov 05 2016 00:40
@Adubiaro a space animated bounce
Tre Reinhart
@treinhar
Nov 05 2016 00:40
it's because of the words "Upside-down"
Erick Rodriguez
@erickrod54
Nov 05 2016 00:40
youre doing good @etsmith11 ... check if you add the class rigth
Tre Reinhart
@treinhar
Nov 05 2016 00:40
I had to change it to "Upsidedown"
I tried to see if it could be escaped using "\" and no luck..
Walid Ashri
@walidashri
Nov 05 2016 00:40
@Danibo26 you already did in the style
Erick Rodriguez
@erickrod54
Nov 05 2016 00:41
between the style tag on line of class @Danibo26 in your case .smaller-image
Darre Zhou
@zhoukeeper
Nov 05 2016 00:41

@Adubiaro

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

$("button").addClass ("animated bounce");

});
</style>

kennethlv13
@kennethlv13
Nov 05 2016 00:42

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

<h2>CatPhotoApp</h2>

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

Your h2 element should have the class red-text
<style>
red-text?
Erick Rodriguez
@erickrod54
Nov 05 2016 00:44
blob
blob
Danni
@Danibo26
Nov 05 2016 00:44
OH! I understand now. I had created the class, but hadn't told the class where to be active. AWESOME !
Erick Rodriguez
@erickrod54
Nov 05 2016 00:44
blob
Danni
@Danibo26
Nov 05 2016 00:44
Thanks @walidashri and @erickrod54
CamperBot
@camperbot
Nov 05 2016 00:44
danibo26 sends brownie points to @walidashri and @erickrod54 :sparkles: :thumbsup: :sparkles:
:cookie: 81 | @erickrod54 |http://www.freecodecamp.com/erickrod54
:warning: danibo26 already gave walidashri points
Walid Ashri
@walidashri
Nov 05 2016 00:44
@Danibo26 :smile: :+1: :clap:
Raushanah
@Raushanah
Nov 05 2016 00:44
So, I completed the HTML5 and CSS section, I still dont feel like I have had my "AHA!" moment.
Feel like these next challenges should be easier for me
Walid Ashri
@walidashri
Nov 05 2016 00:45
@Raushanah no worries u'll got them in the projects
__mifflin__
@cdrainxv
Nov 05 2016 00:45
@Raushanah: Then redo it...
Erick Rodriguez
@erickrod54
Nov 05 2016 00:45
youre welcome @Danibo26
Alexander Køpke
@alexanderkopke
Nov 05 2016 00:46
@zhoukeeper you have a space between addClass and ("animated"). You have a space after all the addClass. Remove the space and you'll pass
Emmanuel
@chriemma
Nov 05 2016 00:46
can someone show me how to do this am lost /www.freecodecamp.com/challenges/add-font-awesome-icons-to-our-button
Darre Zhou
@zhoukeeper
Nov 05 2016 00:46
@alexanderkopke THANKS wow that's sooo simple
CamperBot
@camperbot
Nov 05 2016 00:46
zhoukeeper sends brownie points to @alexanderkopke :sparkles: :thumbsup: :sparkles:
:cookie: 828 | @alexanderkopke |http://www.freecodecamp.com/alexanderkopke
Raushanah
@Raushanah
Nov 05 2016 00:47
@walidashri how so?
Emily Smith
@etsmith11
Nov 05 2016 00:49
@erickrod54 <img class=".smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "> is this how to class is suppose to look? I think im getting myself confused
Walid Ashri
@walidashri
Nov 05 2016 00:49
@Raushanah when you'll do the projects you'll see what I mean
@etsmith11 class="smaller-image" no dot
Bin Ling
@HoBinLing
Nov 05 2016 00:49

Challenge 101: Target HTML Elements with Selectors Using jQuery
Why do you need "." for "well" but not for "button"

<script>
$(document).ready(function() {
$("button").addClass("animated bounce");
$(".well").addClass("animated shake");
});
</script>

U-ways
@U-ways
Nov 05 2016 00:50
@etsmith11 When you create/define a class you start it with the . operator but when you're using it on an element you should not do that so:
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
__mifflin__
@cdrainxv
Nov 05 2016 00:50
@HoBinLing: button is an html element, while well is a class.
Bin Ling
@HoBinLing
Nov 05 2016 00:51
@cdrainxv Many thanks!
CamperBot
@camperbot
Nov 05 2016 00:51
hobinling sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 725 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Nov 05 2016 00:51
@HoBinLing: Many welcomes! :+1:
Emily Smith
@etsmith11
Nov 05 2016 00:52
oh my look at that! Thank you @U-ways @walidashri and @erickrod54
CamperBot
@camperbot
Nov 05 2016 00:52
etsmith11 sends brownie points to @u-ways and @walidashri and @erickrod54 :sparkles: :thumbsup: :sparkles:
:cookie: 82 | @erickrod54 |http://www.freecodecamp.com/erickrod54
:cookie: 544 | @u-ways |http://www.freecodecamp.com/u-ways
:cookie: 575 | @walidashri |http://www.freecodecamp.com/walidashri
Erick Rodriguez
@erickrod54
Nov 05 2016 00:53
youre welcome @etsmith11 xd
Dhairya NIshar
@dnishar1
Nov 05 2016 01:01

how to nest text input element within a form?
I have this but i don't believe that is correct:

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

Walid Ashri
@walidashri
Nov 05 2016 01:01
8 mints no calls :O
@dnishar1 add the input inside those tags
Bojan Popovic
@bojanpopovic
Nov 05 2016 01:07
Need help with Create a Bootstrap Button
step?
anyone could help me
Erick Rodriguez
@erickrod54
Nov 05 2016 01:08
yes
@bojanpopovic can i help you?
Bojan Popovic
@bojanpopovic
Nov 05 2016 01:08
@erickrod54 cant figure out how to create button element w text
slri
@slri
Nov 05 2016 01:09
@bojanpopovic <button>text</button>
Erick Rodriguez
@erickrod54
Nov 05 2016 01:09
yes thats right @RuinIsProbablyTaken
need the icon for the button @bojanpopovic ?
Bin Ling
@HoBinLing
Nov 05 2016 01:10

Im stuck :( with challenge 108:Target HTML Elements with Selectors Using jQuery

it says

  1. i have not emphasized the text in your target4 button by adding html tags
  2. I failed at making sure the text is otherwise unchanged
    but i dont know whats wrong:

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

Bojan Popovic
@bojanpopovic
Nov 05 2016 01:10
tnx
Brian
@sludge256
Nov 05 2016 01:11
@HoBinLing What was the text originally?
Manish Giri
@Manish-Giri
Nov 05 2016 01:12
@sludge256 nice pic
DivinePrism
@DivinePrism
Nov 05 2016 01:12
how do i add a button?
Bin Ling
@HoBinLing
Nov 05 2016 01:12

@brian before adding anything

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

});
</script>

deniz92
@deniz92
Nov 05 2016 01:13
hello guys ! ı stucked to one thing ! how can i locate 'fa-thumbs-up' icon to like button?can anyone help me ?
Bin Ling
@HoBinLing
Nov 05 2016 01:13
@DivinePrism <button>text</button>
Brian
@sludge256
Nov 05 2016 01:13
@HoBinLing I mean in button.
@Manish-Giri thanks
CamperBot
@camperbot
Nov 05 2016 01:13
sludge256 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 2186 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Nov 05 2016 01:13
@deniz92 what do you mean ‘locate’?
deniz92
@deniz92
Nov 05 2016 01:13
to put within it
it says ' Your fa-thumbs-up icon should be located within the Like button.'
Erick Rodriguez
@erickrod54
Nov 05 2016 01:14
yes @deniz92 <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button
Bin Ling
@HoBinLing
Nov 05 2016 01:14
Oh @Brian i see!!!! I know how to know i missed out a #
@sludge256 thank you
CamperBot
@camperbot
Nov 05 2016 01:14
hobinling sends brownie points to @sludge256 :sparkles: :thumbsup: :sparkles:
:star2: 2957 | @sludge256 |http://www.freecodecamp.com/sludge256
deniz92
@deniz92
Nov 05 2016 01:14
thankk erick appreciated !
DivinePrism
@DivinePrism
Nov 05 2016 01:14
@HoBinLing thanks
CamperBot
@camperbot
Nov 05 2016 01:14
divineprism sends brownie points to @hobinling :sparkles: :thumbsup: :sparkles:
:cookie: 109 | @hobinling |http://www.freecodecamp.com/hobinling
Erick Rodriguez
@erickrod54
Nov 05 2016 01:15
mention me plz @deniz92
for the cookie bro
;)
deniz92
@deniz92
Nov 05 2016 01:15
ı gotcha u ,thanks man :smile: ) @erickrod54
Erick Rodriguez
@erickrod54
Nov 05 2016 01:16
your welcome xxd @deniz92
rundhirmc
@rundhirmc
Nov 05 2016 01:22
I have no idea what I did wrong here
can someone help?
I will post the code
Clyde Lobo
@oppiniated
Nov 05 2016 01:22
@rundhirmc ?
rundhirmc
@rundhirmc
Nov 05 2016 01:22
its from Override Styles in Subsequent CSS
Clyde Lobo
@oppiniated
Nov 05 2016 01:23
ok
rundhirmc
@rundhirmc
Nov 05 2016 01:23
<style>
  body {
    background-color: black;
    font-family: Monospace;
    color: green;
  }

  .pink-text {
    color: pink;
  }

  .blue-text {
    color:blue;
  }

</style>
<h1 class1="pink-text" class2="blue-text">Hello World!</h1>
Erick Rodriguez
@erickrod54
Nov 05 2016 01:24
ok @rundhirmc the last class you add Override
Clyde Lobo
@oppiniated
Nov 05 2016 01:24
@rundhirmc class1="pink-text" class2="blue-text" is invalid
Bin Ling
@HoBinLing
Nov 05 2016 01:24
@rundhirmc <h1 class="pink-text blue-text">Hello World</h1>
rundhirmc
@rundhirmc
Nov 05 2016 01:25
gotcha
Erick Rodriguez
@erickrod54
Nov 05 2016 01:25
for example class1="pink-text blue-text"... the results text blue
rundhirmc
@rundhirmc
Nov 05 2016 01:25
thanks!
Erick Rodriguez
@erickrod54
Nov 05 2016 01:25
plz @rundhirmc mention us jeje
__mifflin__
@cdrainxv
Nov 05 2016 01:26
thanks @HoBinLing @erickrod54 @oppiniated
CamperBot
@camperbot
Nov 05 2016 01:26
cdrainxv sends brownie points to @hobinling and @erickrod54 and @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 86 | @erickrod54 |http://www.freecodecamp.com/erickrod54
:cookie: 114 | @hobinling |http://www.freecodecamp.com/hobinling
:cookie: 302 | @oppiniated |http://www.freecodecamp.com/oppiniated
Erick Rodriguez
@erickrod54
Nov 05 2016 01:26
thanks @cdrainxv
CamperBot
@camperbot
Nov 05 2016 01:26
erickrod54 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 726 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 01:26
lets see if I can score some points now haha has the rookie turned in to a semi rook
rundhirmc
@rundhirmc
Nov 05 2016 01:26
@erickrod54 @HoBinLing @oppiniated thanks!
CamperBot
@camperbot
Nov 05 2016 01:26
rundhirmc sends brownie points to @erickrod54 and @hobinling and @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 87 | @erickrod54 |http://www.freecodecamp.com/erickrod54
:cookie: 115 | @hobinling |http://www.freecodecamp.com/hobinling
:cookie: 303 | @oppiniated |http://www.freecodecamp.com/oppiniated
Bin Ling
@HoBinLing
Nov 05 2016 01:27
@rundhirmc goodluck!
Erick Rodriguez
@erickrod54
Nov 05 2016 01:27
semi rook xd
see you guys i'll rest
ADIL KARMOUZI
@mradil16
Nov 05 2016 01:30
Hi everyone. I have designed my portfolio website , and I want to know what do you think about it. thanks : https://postimg.org/gallery/2v20q87yw/
Noah
@DAASIAN99
Nov 05 2016 01:31
How do i successfully close an img tag with alt attribute??
Burak
@BurakAy
Nov 05 2016 01:31
@DAASIAN99 img is self closing
just <img alt="" >
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 01:32
@mradil16 looks nice!
Noah
@DAASIAN99
Nov 05 2016 01:32
thanks! @BurakAy
CamperBot
@camperbot
Nov 05 2016 01:32
daasian99 sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 122 | @burakay |http://www.freecodecamp.com/burakay
ADIL KARMOUZI
@mradil16
Nov 05 2016 01:34
@BatmansGoneFishing thank you
CamperBot
@camperbot
Nov 05 2016 01:34
mradil16 sends brownie points to @batmansgonefishing :sparkles: :thumbsup: :sparkles:
:cookie: 67 | @batmansgonefishing |http://www.freecodecamp.com/batmansgonefishing
Burak
@BurakAy
Nov 05 2016 01:34
@DAASIAN99 no problem,
@DAASIAN99 thank you for the question
CamperBot
@camperbot
Nov 05 2016 01:35
burakay sends brownie points to @daasian99 :sparkles: :thumbsup: :sparkles:
:cookie: 2 | @daasian99 |http://www.freecodecamp.com/daasian99
Bin Ling
@HoBinLing
Nov 05 2016 01:35
@mradil16 not programming related, but you may want to change morocco to Morocco as it is the name of your country!
https://www.scribendi.com/advice/capitalization.en.html
its really nice and good luck for your future career~
Burak
@BurakAy
Nov 05 2016 01:39
@mradil16 I like your site, it's very artistic. Only suggestion I have is to try your best to clean up the grammar in your About page.
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 01:42
good night folks thanks for all your help today! see ya!!
Burak
@BurakAy
Nov 05 2016 01:46
anybody know if it's bad practice to use multiple .jumbotron classes within a page?
or .container-fluid
elzemrany
@elzemrany
Nov 05 2016 01:48
hello world
CamperBot
@camperbot
Nov 05 2016 01:48

welcome to FreeCodeCamp @elzemrany!

elzemrany
@elzemrany
Nov 05 2016 01:49
he told me do not change the order of the h1 h2 or p in the code. !! how can i do this !!
Walid Ashri
@walidashri
Nov 05 2016 01:56
@elzemrany comment each separately
elzemrany
@elzemrany
Nov 05 2016 01:58
okay thanks a lot i got it :)
zamora88
@zamora88
Nov 05 2016 01:59
I need to create a colored border around my image. I know have to create another class within the image, but where do I start the sequence?
Burak
@BurakAy
Nov 05 2016 02:00
@zamora88 you'll add the border in css using for example border: 1px solid black
img {
    border: 1px solid black;
}
that will apply a 1px wide solid black border to the img
zamora88
@zamora88
Nov 05 2016 02:02
Great! Do I need to create a new class or input that info within an existing class?
kimmadison2016
@kimmadison2016
Nov 05 2016 02:02
Hi, does anyone know how I set my browser at be at 100% zoom? I'm unable to pass a challenge because I must not have this set correctly. Thanks
A825
@A825
Nov 05 2016 02:03
Hi, does anyone know what I do if it says "your submit button should have the attribute type set to submit?
Burak
@BurakAy
Nov 05 2016 02:03
@kimmadison2016 you can hold down the CTRL button on your keyboard and use the scroll knob on your mouse to zoom in
@A825 when you are creating the button <button type="submit"></button>
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 02:07
hey
A825
@A825
Nov 05 2016 02:07
@BurakAy I've done that but for some reason its incorrect?
Burak
@BurakAy
Nov 05 2016 02:07
post your code
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 02:07
if I havchanged my user name on githud how can I update my fcc so it is in line?
Jacob Sidford
@jacobsidford
Nov 05 2016 02:08
@kimmadison2016 it can also be a problem with the browser, change browser for the challenge if needed.
Burak
@BurakAy
Nov 05 2016 02:09
@zamora88 were you able to figure it out?
Jeff Shapiro
@Jeff-Shapiro
Nov 05 2016 02:09
@kimmadison2016 try pressing ctrl + 0
Noah
@DAASIAN99
Nov 05 2016 02:09
How could i change the pixel size within a "smaller-image" class?
A825
@A825
Nov 05 2016 02:11
@BurakAy <button type="Submit">Submit</button> Sorry the photo isnt posting at the moment
jasonfu97
@jasonfu97
Nov 05 2016 02:11
hi
Jacob Sidford
@jacobsidford
Nov 05 2016 02:12
@DAASIAN99
.smaller-image{
width:100px;
//or
height:100px;
}
Wasn't completely sure on your question though.
Burak
@BurakAy
Nov 05 2016 02:12
can you try changing "submit" to lowercase rather than "Submit"?
Raymond Tremlett
@atlas333
Nov 05 2016 02:13
how to center text ?
Burak
@BurakAy
Nov 05 2016 02:13
@atlas333 text-align: center
Raymond Tremlett
@atlas333
Nov 05 2016 02:13
@BurakAy in line or do i gotta make a class?
A825
@A825
Nov 05 2016 02:13
Thanks @BurakAy It worked!
CamperBot
@camperbot
Nov 05 2016 02:13
a825 sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 123 | @burakay |http://www.freecodecamp.com/burakay
crageous
@crageous
Nov 05 2016 02:13
Set the value of your placeholder attribute to "cat photo URL". How do I do this?
imgoingtotry
@imgoingtotry
Nov 05 2016 02:14
i need help getting my <p>> element red
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 02:14
hey how do I know if im linked to git hud or fxx
Noah
@DAASIAN99
Nov 05 2016 02:14
The challenge calls for "class=smaller-image" within the html img tag but i'm not too sure how to change the pixel size within the tag.. @jacobsidford
Ali R Majnouni
@AliRezaCodes
Nov 05 2016 02:14
fcc
is there a way to change my username on gitter?
Burak
@BurakAy
Nov 05 2016 02:14
@atlas333 is it for one of the challenges?
Raymond Tremlett
@atlas333
Nov 05 2016 02:15
@BurakAy no im makeing another page for practice
Burak
@BurakAy
Nov 05 2016 02:15
@atlas333 if you're using bootstrap there is a text-center class you can add to your element
@atlas333 otherwise you can center in your css with text-align: center property
zamora88
@zamora88
Nov 05 2016 02:18
@BurakAy <img class=" class 2. thick-green-border; smaller-image" } src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back." I was able to get the border color but no the size or style.
Do I need to create a class with every command?
Burak
@BurakAy
Nov 05 2016 02:20
```
<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Raymond Tremlett
@atlas333
Nov 05 2016 02:21
@BurakAy yea i am in bootstrap i tried both neither will work. nor will my image. http://codepen.io/raytiv93/pen/bBGydy
Burak
@BurakAy
Nov 05 2016 02:21
the different classes in your img element should just be separated by a space
Raymond Tremlett
@atlas333
Nov 05 2016 02:22
fixed image i accidently put srec instead of src
Burak
@BurakAy
Nov 05 2016 02:22
@zamora88 and when you apply a style to a class you call it with a . before the class name
@zamora88 ```
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
Kenyon Wilson
@kwilso04
Nov 05 2016 02:22
Good evening @camperbot @ @muhfred @gnetsys @ch3nkula @dannysmith @Leland @simsketch @Zolomon @Steve-Andrew-Lynch @Justin-lu starting my first project. I'm pumped!
Burak
@BurakAy
Nov 05 2016 02:24

@atlas333 you have ```

<h1 class:"text-center">Country Mac</h1>
```

it should by <h1 class="text-center">
crageous
@crageous
Nov 05 2016 02:25

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

<p>Things cats love:</p>

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

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

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

<input type="text" placeholder="this is placeholder text">
Set the value of your placeholder attribute to "cat photo URL". how do i set the value of the placeholder attribute to the "cat photo URL?

Burak
@BurakAy
Nov 05 2016 02:25
@atlas333 then you don't need .text-center { } in your css
Raymond Tremlett
@atlas333
Nov 05 2016 02:26
@BurakAy i have it in my style though which should be fine i though
Burak
@BurakAy
Nov 05 2016 02:26
when i fix it it centers the text
MTJ
@MTJOnline
Nov 05 2016 02:28
Can someone please tell me what's wrong with the following code: <style>
h2 {color: red;}
</style>
Burak
@BurakAy
Nov 05 2016 02:28
@atlas333 remove
.text-center{
    text: center;
  }
from the top of your html
Raymond Tremlett
@atlas333
Nov 05 2016 02:29
Jacob Sidford
@jacobsidford
Nov 05 2016 02:30
hey @DAASIAN99 flicked you a private message.
<img class="smaller-image" src="whatever.jpg" alt="FCC">
Then in css (<style>)
.smaller-image{ width:100px;}
Burak
@BurakAy
Nov 05 2016 02:30

then

<h1 class:"text-center">Country Mac</h1>

should be:

<h1 class="text-center">Country Mac</h1>
instead of an = you have a : after class
LPR-309
@LPR-309
Nov 05 2016 02:31
@MJBASD Nothing's wrong with the syntax there. Is this part of one of the lessons?
zamora88
@zamora88
Nov 05 2016 02:32
@BurakAy you will have to forgive me. I am still trying to figure out why it is not working. I have <img class="smaller-image thick-green-border" and it helped with the border, but I tried to add the width and style but to no avail. Do I add those as well in the quotation marks or after them?
MTJ
@MTJOnline
Nov 05 2016 02:32
@LPR-309 yes part of the html/css lessons
LPR-309
@LPR-309
Nov 05 2016 02:32
@MJBASD Which one? I'll try to help
MTJ
@MTJOnline
Nov 05 2016 02:33
@LPR-309 it's lesson: Use CSS Selectors to Style Elements
Burak
@BurakAy
Nov 05 2016 02:33
@zamora88 within your <style> </style> tags at the top of the page you have to apply your styling
@zamora88 your should have
.thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
  }
LPR-309
@LPR-309
Nov 05 2016 02:34
@MJBASD Oh, okay. You just have to change the value of color: to blue
Burak
@BurakAy
Nov 05 2016 02:34
.thinck-green-border calls the class you declared in your img element
.thick
and you apply your styles within the curly braces for that class
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:38
how do i show the code
Eric Weiss
@eweiss17
Nov 05 2016 02:38
```
crageous
@crageous
Nov 05 2016 02:39
how do you set the value of a place holder? can anybody help?
Eric Weiss
@eweiss17
Nov 05 2016 02:39
be more specific?
zamora88
@zamora88
Nov 05 2016 02:40
Give a man a fish, he'll eat for a day; teach a man to fish, he'll eat for a lifetime. Thanks so much!! @BurakAy
CamperBot
@camperbot
Nov 05 2016 02:40
zamora88 sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 124 | @burakay |http://www.freecodecamp.com/burakay
LPR-309
@LPR-309
Nov 05 2016 02:40

@crageous

<input type="text" placeholder="this is placeholder text">

the placeholder= is the attribute. Change the value of that and it'll change the 'default text' grayed-out inside the input.

AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:41
```
Burak
@BurakAy
Nov 05 2016 02:41
@zamora88 you're welcome!
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:41
@BurakAy how do i show code
what step do i need to follow
crageous
@crageous
Nov 05 2016 02:42

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

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

<p>Things cats love:</p>

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

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

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

<input type="text"placeholder="this is placeholder text">
Set the value of your placeholder attribute to "cat photo URL". I don't know what to do, help

Burak
@BurakAy
Nov 05 2016 02:42
@AnthonyTankHD on the bottom right of the chat there is a small icon that has the markdown
LPR-309
@LPR-309
Nov 05 2016 02:43
@crageous placeholder= is an attribute of <input>. The "this is placeholder text" shows up inside the input before a user writes anything into it. You need to change the "This is placeholder text" to "cat photo URL"
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:44
and now what the next one
Burak
@BurakAy
Nov 05 2016 02:44
@AnthonyTankHD for a block of code you enter three and then hold down shift and press enter then you type in your code then press shift and enter again and close out your code with three more
Eric Weiss
@eweiss17
Nov 05 2016 02:44
``` backticks man
Burak
@BurakAy
Nov 05 2016 02:44
three backticks
Eric Weiss
@eweiss17
Nov 05 2016 02:45
then press shift + enter, and ctrl + enter to post
crageous
@crageous
Nov 05 2016 02:45
@LPR-309 Nice, thank you
CamperBot
@camperbot
Nov 05 2016 02:45
crageous sends brownie points to @lpr-309 :sparkles: :thumbsup: :sparkles:
:cookie: 411 | @lpr-309 |http://www.freecodecamp.com/lpr-309
Jacob Sidford
@jacobsidford
Nov 05 2016 02:45

'''
Just testing the code thing

'''

CamperBot
@camperbot
Nov 05 2016 02:45
:bulb: to format code use backticks! ``` more info
Jacob Sidford
@jacobsidford
Nov 05 2016 02:46
Got it
crageous
@crageous
Nov 05 2016 02:46
I'm not sure how or why i sent brownie points
Eric Weiss
@eweiss17
Nov 05 2016 02:46
if you thank somebody , it does it automatically
just have thanks and @whoever, and it does it
CamperBot
@camperbot
Nov 05 2016 02:46
eweiss17 sends brownie points to @whoever :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for whoever
crageous
@crageous
Nov 05 2016 02:46
I see, brownies for everybody, haha
Walid Ashri
@walidashri
Nov 05 2016 02:47
@crageous thanks like that . just kind of appreciation to the help
CamperBot
@camperbot
Nov 05 2016 02:47
walidashri sends brownie points to @crageous :sparkles: :thumbsup: :sparkles:
:cookie: 35 | @crageous |http://www.freecodecamp.com/crageous
brad
@brad65340
Nov 05 2016 02:49
hows it going guys? anyone needing help with challenges 0-100?
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:49
CatPhotoApp

<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>
brad
@brad65340
Nov 05 2016 02:50
?
Burak
@BurakAy
Nov 05 2016 02:50
@AnthonyTankHD nice you got it
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:50
like that
ScaryRaisin
@ScaryRaisin
Nov 05 2016 02:52

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

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

h2 {
font-family: Lobster, Monospace;
}

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

.smaller-image {
width: 100px;
}
img .thick-green-border {border-color: green; border-width 10px; border-style solid}

</style>

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

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

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

Jordy Cabrera
@J2Squared
Nov 05 2016 02:53
@ScaryRaisin what do you need help with?
christiespk
@christiespk
Nov 05 2016 02:54

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

<p>Things cats love:</p>

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

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

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

<lable><input type="radio" name="indoor-outdoor"> indoor</lable>

<lable><input type="radio" name="indoor-outdoor"> outdoor</lable>

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

ScaryRaisin
@ScaryRaisin
Nov 05 2016 02:54
Give your image a border width of 10px.
Give your image a border style of solid.
The border around your img element should be green.
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:54

```
With CSS, there are hundreds of CSS properties that you can use to change the way an element looks on your page.

When you entered <h2 style="color: red">CatPhotoApp</h2>, you were giving that individual h2 element an inline style.

That's one way to add style to an element, but a better way is by using CSS, which stands for Cascading Style Sheets.

At the top of your code, create a style element like this:

<style>
</style>
Inside that style element, you can create a CSS selector for all h2 elements. For example, if you wanted all h2 elements to be red, your style element would look like this:

<style>
h2 {color: red;}
</style>
Note that it's important to have both opening and closing curly braces ({ and }) around each element's style. You also need to make sure your element's style is between the opening and closing style tags. Finally, be sure to add the semicolon to the end of each of your element's styles.

Delete your h2 element's style attribute and instead create a CSS style element. Add the necessary CSS to turn all h2 elements blue.

Run tests (ctrl + enter)
Reset Help Bug
Remove the style attribute from your h2 element.
Create a style element.
Your h2 element should be blue.
Ensure that your stylesheet h2 declaration is valid with a semicolon and closing brace.
Make sure all your style elements are valid and have a closing tag.

can you help me to understand this
ScaryRaisin
@ScaryRaisin
Nov 05 2016 02:54

CSS borders have properties like style, color and width

For example, if we wanted to create a red, 5 pixel border around an HTML element, we could use this class:

<style>
.thin-red-border {
border-color: red;
border-width: 5px;
border-style: solid;
}
</style>
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:

<img class="class1 class2">

Run tests (ctrl + enter)
Reset Help Bug
Your img element should have the class smaller-image.
Your img element should have the class thick-green-border.
Give your image a border width of 10px.
Give your image a border style of solid.
The border around your img element should be green.

joshandevera
@joshandevera
Nov 05 2016 02:55
how do you post screen shoot of your text editor?
Jax
@jax11000
Nov 05 2016 02:55
curious guys, im on my first front end project. do i need to write my jQuery code in the css, html, or js section?
Jordy Cabrera
@J2Squared
Nov 05 2016 02:55
I need help with rgb
ScaryRaisin
@ScaryRaisin
Nov 05 2016 02:55
pls help
MTJ
@MTJOnline
Nov 05 2016 02:55
@LPR-309 so did you figure out what the problem could be?
__mifflin__
@cdrainxv
Nov 05 2016 02:55

@ScaryRaisin: Error here:

img .thick-green-border

just use .thick-green-border
Also, your stylings should be like this property: value; just as you have for border-color: green;

joshandevera
@joshandevera
Nov 05 2016 02:55
@jax11000 what challenge are you on?
Manish Giri
@Manish-Giri
Nov 05 2016 02:55
@jax11000 goes in the js window
Jax
@jax11000
Nov 05 2016 02:56
thank you
Jordy Cabrera
@J2Squared
Nov 05 2016 02:56
.smaller-image {
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:56
With CSS, there are hundreds of CSS properties that you can use to change the way an element looks on your page.

When you entered <h2 style="color: red">CatPhotoApp</h2>, you were giving that individual h2 element an inline style.

That's one way to add style to an element, but a better way is by using CSS, which stands for Cascading Style Sheets.

At the top of your code, create a style element like this:

<style>
</style>
Inside that style element, you can create a CSS selector for all h2 elements. For example, if you wanted all h2 elements to be red, your style element would look like this:

<style>
  h2 {color: red;}
</style>
Note that it's important to have both opening and closing curly braces ({ and }) around each element's style. You also need to make sure your element's style is between the opening and closing style tags. Finally, be sure to add the semicolon to the end of each of your element's styles.

Delete your h2 element's style attribute and instead create a CSS style element. Add the necessary CSS to turn all h2 elements blue.

Run tests (ctrl + enter)
Reset    Help    Bug
Remove the style attribute from your h2 element.
Create a style element.
Your h2 element should be blue.
Ensure that your stylesheet h2 declaration is valid with a semicolon and closing brace.
Make sure all your style elements are valid and have a closing tag.
Can you help me out here
Jax
@jax11000
Nov 05 2016 02:56
@joshandevera im on build a tribute page, just starting it.
@Manish-Giri thank you
CamperBot
@camperbot
Nov 05 2016 02:56
jax11000 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 2187 | @manish-giri |http://www.freecodecamp.com/manish-giri
LPR-309
@LPR-309
Nov 05 2016 02:56
@MJBASD Yes. You just need to change the color: value to blue. As long as the inline style is gone off the h2, that should work
It's a really long description for something simple on that one, lol.
MTJ
@MTJOnline
Nov 05 2016 02:58
@LPR-309 with the code I have the error handler gives an error message stating "Your h2 element should be blue."
ScaryRaisin
@ScaryRaisin
Nov 05 2016 02:58
@cdrainxv it still says "give your image a border width of 10px"
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 02:58
i doing free code camp for reason to be web developer to create a website
and ofcourse to have fun
chat with people
__mifflin__
@cdrainxv
Nov 05 2016 02:59
@ScaryRaisin: Yes… I already mentioned this: :point_up: November 4, 2016 8:55 PM … look at the syntax I told you to follow and look at yours.
LPR-309
@LPR-309
Nov 05 2016 02:59
@MJBASD You just have the <style> h2 { codehere } </style> part, right? Your h2 doesn't have a style attribute? (It shouldn't)
brad
@brad65340
Nov 05 2016 03:00
@AnthonyTankHD send your code
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 03:00
send my code of what
joshandevera
@joshandevera
Nov 05 2016 03:00
how do you send codesat? here on ch
Jordy Cabrera
@J2Squared
Nov 05 2016 03:01
@ScaryRaisin change width to 10px. Change color to green on border-color: green;.
joshandevera
@joshandevera
Nov 05 2016 03:01
how do you send codes here on chat
Alexander Køpke
@alexanderkopke
Nov 05 2016 03:01
``` then press enter, paste your code in, end with ctrl + enter
MTJ
@MTJOnline
Nov 05 2016 03:02
@LPR-309 so what is wrong with this code? h2 should not be there?
__mifflin__
@cdrainxv
Nov 05 2016 03:02
@joshandevera : code formatting
LPR-309
@LPR-309
Nov 05 2016 03:02

@joshandevera

``     < write 3 of these
code
``

Shift + enter between lines

brad
@brad65340
Nov 05 2016 03:02
didnt you say you needed help? you only sent the instructions what does your code look like so far
@AnthonyTankHD
LPR-309
@LPR-309
Nov 05 2016 03:02
@MJBASD Can you copy paste exactly what you have? I'll mark anything that's wrong
AnthonyTankHD
@AnthonyTankHD
Nov 05 2016 03:03
@brad65340 let go in a private chat
joshandevera
@joshandevera
Nov 05 2016 03:03
'' code ''
MTJ
@MTJOnline
Nov 05 2016 03:03
@LPR-309 <style> h2{color: blue;} CatPhotoApp </style>
joshandevera
@joshandevera
Nov 05 2016 03:04
Burak
@BurakAy
Nov 05 2016 03:04
three ` and then hold shift and press enter. paste your code and thren hold shift and press enter again. three more ` and finally press enter to submit.
Jordy Cabrera
@J2Squared
Nov 05 2016 03:04
‘''
ScaryRaisin
@ScaryRaisin
Nov 05 2016 03:04
@cdrainxv THX!! i got it now!!
CamperBot
@camperbot
Nov 05 2016 03:04
scaryraisin sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 727 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
joshandevera
@joshandevera
Nov 05 2016 03:04
@LPR-309 @BursakAy thank you guy
CamperBot
@camperbot
Nov 05 2016 03:04
joshandevera sends brownie points to @lpr-309 and @bursakay :sparkles: :thumbsup: :sparkles:
:cookie: 412 | @lpr-309 |http://www.freecodecamp.com/lpr-309
:warning: could not find receiver for bursakay
joshandevera
@joshandevera
Nov 05 2016 03:04
*guys
Jordy Cabrera
@J2Squared
Nov 05 2016 03:05

‘’'

<style>
.red-text {
color: rgb(255, 0, 0)
}
.orchid-text {
color: rgb(218, 112, 214)
}
.sienna-text {
color: rgb(160, 82, 45)
}
.blue-text {
color: rgb(0, 0, 255)
}
</style>

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

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

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

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

__mifflin__
@cdrainxv
Nov 05 2016 03:05
@ScaryRaisin: Nice… :+1:
LPR-309
@LPR-309
Nov 05 2016 03:05
@MJBASD Okay.
<style>
 h2 {
color: blue;
} 
</style>
<h2>CatPhotoApp</h2>   <!-- I got rid of the style= attribute here. This is called inline style, you're replacing this. -->

<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>
Jordy Cabrera
@J2Squared
Nov 05 2016 03:05

‘’'

<style>
.red-text {
color: rgb(255, 0, 0)
}
.orchid-text {
color: rgb(218, 112, 214)
}
.sienna-text {
color: rgb(160, 82, 45)
}
.blue-text {
color: rgb(0, 0, 255)
}
</style>

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

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

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

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

‘''

__mifflin__
@cdrainxv
Nov 05 2016 03:06
@J2Squared: missing ; on all your stylings… refer to this: :point_up: November 4, 2016 8:55 PM
Jordy Cabrera
@J2Squared
Nov 05 2016 03:06
@cdrainxv thanks!
CamperBot
@camperbot
Nov 05 2016 03:06
j2squared sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 728 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
LPR-309
@LPR-309
Nov 05 2016 03:07
@MJBASD Edited it a bit :point_up: November 4, 2016 11:05 PM This is correct
__mifflin__
@cdrainxv
Nov 05 2016 03:07
@J2Squared: Glad to help. :+1:
MTJ
@MTJOnline
Nov 05 2016 03:08
@LPR-309 yeah that worked... yeah i see what's going on.... I am supposed to add the <h2> CatPhotoApp </h2> after the line I have just pasted to you.
Jordy Cabrera
@J2Squared
Nov 05 2016 03:08

<style>
  .red-text {
    color: rgb(255, 0, 0)
  }
  .orchid-text {
    color: rgb(218, 112, 214)
  }
  .sienna-text {
    color: rgb(160, 82, 45)
  }
  .blue-text {
    color: rgb(0, 0, 255)
  }
</style>

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

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

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

<h1 class="blue-text">I am blue!</h1>
finally thanks guys
MTJ
@MTJOnline
Nov 05 2016 03:09
@LPR-309 that explains why 'CatPhotoApp' text did not get printed out on phone.
@LPR-309 Thank you so much :-)
CamperBot
@camperbot
Nov 05 2016 03:09
mjbasd sends brownie points to @lpr-309 :sparkles: :thumbsup: :sparkles:
:cookie: 413 | @lpr-309 |http://www.freecodecamp.com/lpr-309
LPR-309
@LPR-309
Nov 05 2016 03:11
@MJBASD Yep. Everything past <style> is actual DOM elements, so they show up 'physically'. <style> is the "CSS section" of the html, so you're using that to affect those elements. It's also usually in the <head>. FCC doesn't go too much into <head> and <body>, and what should be in them, but it should, since that's essential. Also, np, glad it worked :thumbsup:
MTJ
@MTJOnline
Nov 05 2016 03:12
@LPR-309 :-)
Raghavendra Deepak Dupuguntala
@deepakloyola
Nov 05 2016 03:17
Hello World!
CamperBot
@camperbot
Nov 05 2016 03:17

welcome to FreeCodeCamp @deepakloyola!

Raghavendra Deepak Dupuguntala
@deepakloyola
Nov 05 2016 03:17
Please help me with this lesson Make Images Mobile Responsive
__mifflin__
@cdrainxv
Nov 05 2016 03:18
@deepakloyola: I believe it tells you to add the class img-responsive to your img tag?
Raghavendra Deepak Dupuguntala
@deepakloyola
Nov 05 2016 03:18
Yeah @cdrainxv
but how to add this in style?
__mifflin__
@cdrainxv
Nov 05 2016 03:19
@deepakloyola: You don’t have to add it in your style tag. img-responsive is a bootstrap class… bootstrap already has it styled for you...
Raghavendra Deepak Dupuguntala
@deepakloyola
Nov 05 2016 03:20
@cdrainxv so how will the sample look like
img-responsive= "https://bit.ly/fcc-running-cats."
Raushanah
@Raushanah
Nov 05 2016 03:21
Challenge: Create a Bootstrap Button
Problem:Your new button should have the class btn
__mifflin__
@cdrainxv
Nov 05 2016 03:22
@deepakloyola:No… it’s the same as just adding a class like you have done before:
<img class="class1 class2 class3" src="…." alt="…">
Raushanah
@Raushanah
Nov 05 2016 03:22

Code: </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" alt="A cute orange cat lying on its back. "></a>

<img src="https://bit.ly/fcc-running-cats" class="img-responsive btn" alt="Three kittens running towards the camera. ">
<button type="Like">Like</button>

Can someone help?
I created an actual button below the image included the class "btn"
__mifflin__
@cdrainxv
Nov 05 2016 03:23
@Raushanah: the class btn should be in your button element… not in your img as you currently have it.
Raushanah
@Raushanah
Nov 05 2016 03:23
oky doky @cdrainxv will try
@cdrainxv THANK YOU
CamperBot
@camperbot
Nov 05 2016 03:27
raushanah sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 729 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Raushanah
@Raushanah
Nov 05 2016 03:27

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

<img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera. ">
<button type="Like">Like</button>
<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>
<button class="btn">Button</button>
</form>
</div>

Raghavendra Deepak Dupuguntala
@deepakloyola
Nov 05 2016 03:28
@cdrainxv <a href="#"><img class="smaller-image thick-green-border""img-responsive" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back." src="https://bit.ly/fcc-running-cats."></a>
This way?
Lucas
@lucas032689
Nov 05 2016 03:28
I'm having trouble with changing text inside an element using jQuery
__mifflin__
@cdrainxv
Nov 05 2016 03:29
@deepakloyola: multiple classes are written like this:
class="class1 class2 class3" … notice the classes are just separated by a space and only one set of quotes.
@Raushanah: You only needed one button:
You can have multiple attributes for the same element. Remember this?:
<img src="link" class="class1 class2" alt="words">
Here img has a src, class, and alt attribute… same applies to all other elements… including your button element.
@lucas032689: Show me what you have.
Jax
@jax11000
Nov 05 2016 03:34
slightly confused about how this codepen.io works, im unsure about what code to write where with the html css and js sections, can someone explain it to me please?
Alexander Køpke
@alexanderkopke
Nov 05 2016 03:36
@lucas032689 which method if any are you trying to use?
__mifflin__
@cdrainxv
Nov 05 2016 03:36
@jax11000: write your html in html, css is for your styling… on FCC it was what you put in the style tags… and js is for javascript… where your jquery will go… (as jquery is a library for javascript).
Jax
@jax11000
Nov 05 2016 03:37
@cdrainxv oh so its just an easy way to break up your code? because currently i have my style code in the html category and its working just fine
__mifflin__
@cdrainxv
Nov 05 2016 03:38
@jax11000: Yes… it’s easier that way… in practical situations all your code: html, css, and js would have it’s own page and they would just be linked.
Although you can have all your code in the html with your styling in style tags and your js/jquery in script tags...
Jax
@jax11000
Nov 05 2016 03:41
@cdrainxv gotcha so i dont need <script> $(document).ready(function(){});
</script at all for the jquery?
Hermin Robillard
@hermin303
Nov 05 2016 03:42
Hello my people... help please...
Jax
@jax11000
Nov 05 2016 03:43
@cdrainxv thanks man youre a lifesaver
CamperBot
@camperbot
Nov 05 2016 03:43
jax11000 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 730 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Nov 05 2016 03:44
@jax11000: You won’t need style tags if you write your css stylings in your css tab. Additionally, you won’t need your script tags in your js tab, but you should include
$(document).ready(function(){
 code here
});
@jax11000: no problem… :smile:
Jax
@jax11000
Nov 05 2016 03:45
@cdrainxv hopefully ill be able to help a newbie out like you at some point lol
__mifflin__
@cdrainxv
Nov 05 2016 03:46
@jax11000: I’m only a newbie as well… always will be… I always want to learn…
And you will… keep on learning! :smile: thanks!
CamperBot
@camperbot
Nov 05 2016 03:46
cdrainxv sends brownie points to @jax11000 :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @jax11000 |http://www.freecodecamp.com/jax11000
Alexander Køpke
@alexanderkopke
Nov 05 2016 03:47
@lucas032689 ok I read the instructions. First you select the element $('#target4'). then you add the method. ?$('#target4').html(). Then we look to see what text of the element is: #target4. Ok so we're suppose to emphasize the text that is already there. Basically we have to write what is already there and add the <em></em>around it. It should looks a bit like this: $('#target4').html('<em>#target4</em>');
@hermin303 hi we need to know what is the problem and see the code in question
Shemar
@mikey10006
Nov 05 2016 03:51
hey, im having trouble with the first challenge im confused as to how get a well that large for my page https://codepen.io/FreeCodeCamp/full/NNvBQW/
do i just encase all of my text in the well div?
and itll work out
Walid Ashri
@walidashri
Nov 05 2016 03:53
@mikey10006 lookup jumbotron
Shemar
@mikey10006
Nov 05 2016 03:53
kk :D
__mifflin__
@cdrainxv
Nov 05 2016 03:53
@walidashri: Is that a js challenge name? :smile:
Walid Ashri
@walidashri
Nov 05 2016 03:54
@cdrainxv no JQuery :P
__mifflin__
@cdrainxv
Nov 05 2016 03:55
jQuery? Never heard of it…. is it like php? @walidashri
Shemar
@mikey10006
Nov 05 2016 03:55
its like a bootstrap for js if that makes sense
Walid Ashri
@walidashri
Nov 05 2016 03:56
@mikey10006 He is thinking him self funny @cdrainxv
@cdrainxv No it's like Axios
__mifflin__
@cdrainxv
Nov 05 2016 03:58
@mikey10006 : Wait is it like a library for JS the same way bootstrap is a library for CSS… need to further investigate… :books: :book:
Walid Ashri
@walidashri
Nov 05 2016 03:58
@mikey10006 nvm we just teasing each other
Christianbt
@Christianbt
Nov 05 2016 03:58
how do you comment out an element
__mifflin__
@cdrainxv
Nov 05 2016 03:59
@walidashri: This is the first I’ve ever heard of Axios...
Shemar
@mikey10006
Nov 05 2016 03:59
Jacob Sidford
@jacobsidford
Nov 05 2016 03:59
yes Jquery is a library for JS
Walid Ashri
@walidashri
Nov 05 2016 03:59
@cdrainxv Oh realy?
__mifflin__
@cdrainxv
Nov 05 2016 04:00
@walidashri: I’m just in the midst of updating my api projects to use promises instead of callback functions.
Walid Ashri
@walidashri
Nov 05 2016 04:03
@cdrainxv so lookup Axios :P
__mifflin__
@cdrainxv
Nov 05 2016 04:03
@walidashri: just did… reading the documentation on github.
augustinmissoffe
@augustinmissoffe
Nov 05 2016 04:05
Hi, i on the class 47. I don't succeed to change the background colours in green without giving to the form any class or style attributes
any recommendation?
Walid Ashri
@walidashri
Nov 05 2016 04:06
@cdrainxv no :brownies: :(
Shemar
@mikey10006
Nov 05 2016 04:06
@walidashri the jumbotron worked, thank you much much :)
CamperBot
@camperbot
Nov 05 2016 04:06
mikey10006 sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 582 | @walidashri |http://www.freecodecamp.com/walidashri
Shemar
@mikey10006
Nov 05 2016 04:07
*so much
__mifflin__
@cdrainxv
Nov 05 2016 04:07
@augustinmissoffe: Show code and then we can give you pointers.
@walidashri: thanks?
CamperBot
@camperbot
Nov 05 2016 04:07
cdrainxv sends brownie points to @augustinmissoffe and @walidashri :sparkles: :thumbsup: :sparkles:
:cookie: 48 | @augustinmissoffe |http://www.freecodecamp.com/augustinmissoffe
:cookie: 583 | @walidashri |http://www.freecodecamp.com/walidashri
samuelsmith442
@samuelsmith442
Nov 05 2016 04:07
im doing target html elements with selectors using jquery im trying to make the button elements bounce with $("button").addclass("animated bounce");
but its not working is it a bug
__mifflin__
@cdrainxv
Nov 05 2016 04:08
@samuelsmith442: show full code first… only the one in the script tags though.
samuelsmith442
@samuelsmith442
Nov 05 2016 04:16

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

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

sorry <script>
$(document).ready(function() {
$("button").addclass("animated bounce");
});
</script>
Bojan Popovic
@bojanpopovic
Nov 05 2016 04:18
how to add thumbs up icon into button
?
<div class="col-xs-4">
<button class="btn btn-block btn-primary">Like</button>
</div>
BesadaN
@BesadaN
Nov 05 2016 04:18
question: what is <style> ?
and do you have to include before declaring any class?
Bojan Popovic
@bojanpopovic
Nov 05 2016 04:19
<I class="fa fa-thumbs-up"></I>
__mifflin__
@cdrainxv
Nov 05 2016 04:20
@bojanpopovic: in the button… You see how b/t the opening and closing button tags you added Like and it shows on the button? So anything added there will be shown on the button… add it before the Like.
Landon M. Vogel
@landonv360
Nov 05 2016 04:21
@BesadaN I dont thing you have to declare a class before a style...most i've seen were images so the sizes of it may have an effect. But im learning myself at the momment.
BesadaN
@BesadaN
Nov 05 2016 04:21
@landonv360 Gotcha. thank u
CamperBot
@camperbot
Nov 05 2016 04:21
besadan sends brownie points to @landonv360 :sparkles: :thumbsup: :sparkles:
:cookie: 24 | @landonv360 |http://www.freecodecamp.com/landonv360
__mifflin__
@cdrainxv
Nov 05 2016 04:22
@samuelsmith442 : addClass
Landon M. Vogel
@landonv360
Nov 05 2016 04:22
@camperbot :)
samuelsmith442
@samuelsmith442
Nov 05 2016 04:23
@cdrainxv thanks i just changed that and it worked
CamperBot
@camperbot
Nov 05 2016 04:23
samuelsmith442 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 731 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Nov 05 2016 04:24
@samuelsmith442: It’s because it’s the proper syntax… :smile:
samuelsmith442
@samuelsmith442
Nov 05 2016 04:26
@cdrainxv think i should learn javascript then jquery
c0d0er
@c0d0er
Nov 05 2016 04:28
does anybody know why i use <script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js'></script> to add jquery ui causes error? how could i correctly add jquery ui with script tag?
Landon M. Vogel
@landonv360
Nov 05 2016 04:28
@samuelsmith442 I very recently just started, but i know they all have guides, as to which one you go to first. I'm working on python right now, but going through HTML5 with the course on here..it seems similar no matter what direction you go, if you never followed a path before...lol
__mifflin__
@cdrainxv
Nov 05 2016 04:29
@samuelsmith442: You will learn javascript… but you will probably use jQuery extensively for your projects.
nuhanova
@nuhanova
Nov 05 2016 04:29
which browser works best with freecodecamp?
Trey
@egrogan0003
Nov 05 2016 04:31
need help plz

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

</style>

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

Landon M. Vogel
@landonv360
Nov 05 2016 04:31
@c0d0er its a shot...but your first script isn't opened <script> src='https://cdn....etc
Trey
@egrogan0003
Nov 05 2016 04:31
i am trying to set h1 with a pink color
c0d0er
@c0d0er
Nov 05 2016 04:32
@landonv360 do you know the correct jquery ui script setting?
@landonv360 thanks
CamperBot
@camperbot
Nov 05 2016 04:34
:cookie: 25 | @landonv360 |http://www.freecodecamp.com/landonv360
c0d0er sends brownie points to @landonv360 :sparkles: :thumbsup: :sparkles:
Landon M. Vogel
@landonv360
Nov 05 2016 04:35
:) thx
Jacob Sidford
@jacobsidford
Nov 05 2016 04:40
@egrogan0003 <h1 class="pink-text"> Hello World!</h1>
you used ':' instead of '=' in the html
Luis
@luixherbfriend
Nov 05 2016 04:41
Create a class called smaller-image and use it to resize the image so that it's only 100 pixels wide.???? is it .smaller-image{
width:100px} where does it need to be written?
Jacob Sidford
@jacobsidford
Nov 05 2016 04:42
@luixherbfriend write it between the <style> tags.
<style>
.smaller-image{
    width:100px;
}
</style>
then add
<img class="smaller-image" src="image.jpg" alt="alt text">
in the html
of course, edited to what's required.
Luis
@luixherbfriend
Nov 05 2016 04:51

this is what i got can you see whats wrong?

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

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

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

</style>

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

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

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

@jacobsidford
Manish Giri
@Manish-Giri
Nov 05 2016 04:53
@luixherbfriend haven't applied the class on the img
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Jacob Sidford
@jacobsidford
Nov 05 2016 04:55

@luixherbfriend @Manish-Giri
^ is right.

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

Is with class applied.

lfvp
@lfvp
Nov 05 2016 04:59
Guys how can I put a image in the centre of the page?
Do I have to put it inside a div?
Luis
@luixherbfriend
Nov 05 2016 05:00
thanks @Manish-Giri @jacobsidford
CamperBot
@camperbot
Nov 05 2016 05:00
luixherbfriend sends brownie points to @manish-giri and @jacobsidford :sparkles: :thumbsup: :sparkles:
:cookie: 120 | @jacobsidford |http://www.freecodecamp.com/jacobsidford
:star2: 2188 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Nov 05 2016 05:02
@luixherbfriend welcome
rairohan52
@rairohan52
Nov 05 2016 05:02
HELLO to everyone,,iam new to this,,hope u guys will help me out,,thank u
Jacob Sidford
@jacobsidford
Nov 05 2016 05:02
if it's one of the early challenges, it's
.img-responsive or there's .block-center
@lfvp
Thatguy5153
@Thatguy5153
Nov 05 2016 05:03
hello
lfvp
@lfvp
Nov 05 2016 05:04
@ thanks mate
Jacob Sidford
@jacobsidford
Nov 05 2016 05:04
No worries Luis, good day @Thatguy5153
Thatguy5153
@Thatguy5153
Nov 05 2016 05:05
i'm new to this how would i change the font size of the second p element??
Huangzhen111
@Huangzhen111
Nov 05 2016 05:05
$(".well")
why need to add“.”
plz
__mifflin__
@cdrainxv
Nov 05 2016 05:06
@Huangzhen111: well is a class.
Huangzhen111
@Huangzhen111
Nov 05 2016 05:06
thx
Jacob Sidford
@jacobsidford
Nov 05 2016 05:07
@Thatguy5153
:nth-child(2)
Thatguy5153
@Thatguy5153
Nov 05 2016 05:07
??
Landon M. Vogel
@landonv360
Nov 05 2016 05:07
@Thatguy5153 sent you what i did....it worked for me
Raushanah
@Raushanah
Nov 05 2016 05:08
Challenge: Use the Bootstrap Grid to Put Elements Side By Side
Thatguy5153
@Thatguy5153
Nov 05 2016 05:08
@landonv360 thank you
CamperBot
@camperbot
Nov 05 2016 05:08
thatguy5153 sends brownie points to @landonv360 :sparkles: :thumbsup: :sparkles:
:cookie: 27 | @landonv360 |http://www.freecodecamp.com/landonv360
Raushanah
@Raushanah
Nov 05 2016 05:08
Problem:Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Jacob Sidford
@jacobsidford
Nov 05 2016 05:08
if it's the jquery tutorial, I think it's
$(".target:nth-child(2)").css("font-size", "16");
Lauw Dastin
@lauwdastin
Nov 05 2016 05:08
excuse me
can i ask a question
how to make a dead link
Jacob Sidford
@jacobsidford
Nov 05 2016 05:10

@Raushanah

<div class="row">
<div class="col-xs-4">
<button>
</div> <div class="col-xs-4">
<button>
</div><div class="col-xs-4">
<button>
</div>

</div>

Just wrap your buttons with those div's

Manish Giri
@Manish-Giri
Nov 05 2016 05:10
@lauwdastin replace the current value of href (the link) with a hash #
Raushanah
@Raushanah
Nov 05 2016 05:11

Code:<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" alt="A cute orange cat lying on its back. "></a>
<div class="row">
<img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera. ">

<button class=col-xs-4 class="btn btn-block btn-primary">Like</button>

<button class= col-xs-4 class="btn btn-block btn-info">Info</button>

<button class="col-xs-4 class="btn btn-block btn-danger">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>

Need Help
Jacob Sidford
@jacobsidford
Nov 05 2016 05:11
what's requested? @Raushanah
ah I see
Raushanah
@Raushanah
Nov 05 2016 05:12
Challenge: Use the Bootstrap Grid to Put Elements Side By Side @jacobsidford
Not sure whats wrong with the code
Lauw Dastin
@lauwdastin
Nov 05 2016 05:12
It works, thank you @Manish-Giri
CamperBot
@camperbot
Nov 05 2016 05:12
lauwdastin sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 2189 | @manish-giri |http://www.freecodecamp.com/manish-giri
Raushanah
@Raushanah
Nov 05 2016 05:13
Problem:Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Jacob Sidford
@jacobsidford
Nov 05 2016 05:13

Think of it as a shelf.
You want stick your shelf on the wall.

<div class="row">

You then put three buttons and dividers between each of them on the shelf.

<div class="col-xs-4">

the number represents the width of each space

but you need to nest them separately, you haven't wrapped your buttons in a div.
You also put your image in the row
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:14
Use a CSS Class to Style an Element
opps sorry
was trying to type a question.
Raushanah
@Raushanah
Nov 05 2016 05:15
Yes, the buttons are in a row @jacobsidford
Jacob Sidford
@jacobsidford
Nov 05 2016 05:16
@Raushanah
<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>
that's what your row should look like.
Raushanah
@Raushanah
Nov 05 2016 05:16
<div class="row">
<img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera. ">
<button class=col-xs-4 class="btn btn-block btn-primary">Like</button>
<button class= col-xs-4 class="btn btn-block btn-info">Info</button>
<button class="col-xs-4 class="btn btn-block btn-danger">Delete</button>
</div>
Dusliat
@Alchemistioc
Nov 05 2016 05:16
Hey guys! I'm stuck on sizing an img with a class.
Raushanah
@Raushanah
Nov 05 2016 05:16
Ive done this all wrong but I have green checks
Jacob Sidford
@jacobsidford
Nov 05 2016 05:17
yea so that's the bit I edited, compare it to the code I just posted.
Raushanah
@Raushanah
Nov 05 2016 05:17
Will re do @jacobsidford
Jacob Sidford
@jacobsidford
Nov 05 2016 05:17
@Alchemistioc
if you're at smaller-image, the code is
smaller-image{
    width:100px;
}
in the style tags
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:19

my h2 element is not red can someone explain why?

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

Dusliat
@Alchemistioc
Nov 05 2016 05:19
Holy crap thanks! And the class. I tried this, but it's wrong. <img src="https://bit.ly/fcc-relaxing-cat" class="smaller-size" alt="A cute orange cat lying on its back.">
Jacob Sidford
@jacobsidford
Nov 05 2016 05:19
@Jacktheknave your class declarations have their brackets the wrong way.
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:20
wow I have been looking at this for like 10 mins
Luis
@luixherbfriend
Nov 05 2016 05:20
i am trying to create a border with this <style>
. thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
</style>
where is suppose to be written?
Raushanah
@Raushanah
Nov 05 2016 05:21

@jacobsidford <img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera. ">
<div class="row">
<div class="col-xs-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>

That cod e does not work
Jacob Sidford
@jacobsidford
Nov 05 2016 05:22
Having trouble seeing the problem sorry @Alchemistioc
Checked with a friend and they aren't quite sure either.
Are you applying the class correctly or is no image appearing?
Manish Giri
@Manish-Giri
Nov 05 2016 05:22
@DarrenfJ leaving this for when you come in the room, many thanks for the endorsement! Highly appreciated :smile:
CamperBot
@camperbot
Nov 05 2016 05:22
manish-giri sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 1017 | @darrenfj |http://www.freecodecamp.com/darrenfj
Girzima
@Girzima
Nov 05 2016 05:23
Goddamn w3
down all day
Jacob Sidford
@jacobsidford
Nov 05 2016 05:24
@luixherbfriend there's a space in your class declaration I think?
That's a class so it'd go <div class="thick-green-border">
Manish Giri
@Manish-Giri
Nov 05 2016 05:24
@Girzima head to mdn!
Jacob Sidford
@jacobsidford
Nov 05 2016 05:24
@Raushanah
There's an error in your third button, you didn't close the opening col-xs-4 div
and yea, I went to check w3 before but it's down :/
I just wanted that because I know exactly where everything is I want
Dusliat
@Alchemistioc
Nov 05 2016 05:25
@jacobsidford the image appears, possibly applying the class incorrectly but not sure how.
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:26
still not red??
Manish Giri
@Manish-Giri
Nov 05 2016 05:26
@Alchemistioc copy paste your challenge URL here, from the browser
Fiona Li
@Fiona1133
Nov 05 2016 05:26
Can anyone help me figure it out?
Add a div element with the class well inside each of your div elements with the class "col-xs-6"
Dusliat
@Alchemistioc
Nov 05 2016 05:26
@jacobsidford it worked, the website just had a little hiccup
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:27

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

Manish Giri
@Manish-Giri
Nov 05 2016 05:27
@Jacktheknave remove the h2 before .red-text
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:27
@Manish-Giri okay thanks
CamperBot
@camperbot
Nov 05 2016 05:27
:star2: 2190 | @manish-giri |http://www.freecodecamp.com/manish-giri
jacktheknave sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:27
@jacobsidford also thanks
CamperBot
@camperbot
Nov 05 2016 05:27
jacktheknave sends brownie points to @jacobsidford :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @jacobsidford |http://www.freecodecamp.com/jacobsidford
Jacob Sidford
@jacobsidford
Nov 05 2016 05:28
<style>
.red-text {
color: red;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
@Jacktheknave I can't really see a problem with it.
Clint
@XkyFox
Nov 05 2016 05:29
Hmmm
What is it asking for?
WhiteLeaf1103
@WhiteLeaf1103
Nov 05 2016 05:30
does somebody grade our projects and give us freedback?
Johnny
@JohnnyBizzel
Nov 05 2016 05:30
@WhiteLeaf1103 You get feedback if you ask people to review what you've done.
Clint
@XkyFox
Nov 05 2016 05:30

Looking to make the p element have the monospace font and the h2 element have the Lobster font. Any ideas? <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

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

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

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

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

Jacob Sidford
@jacobsidford
Nov 05 2016 05:31
@XkyFox don't use red-text on the P.
because it's less general it'll override.
Johnny
@JohnnyBizzel
Nov 05 2016 05:32
@XkyFox Find out about order of implementation of classes. CSS means "Cascading" style sheet.
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:32
@WhiteLeaf1103 they will be evaluated after u complete all requirements for a certificate
Jacob Sidford
@jacobsidford
Nov 05 2016 05:32
The more specified a css selector is, the more it'll override.
Clint
@XkyFox
Nov 05 2016 05:32
ok
__mifflin__
@cdrainxv
Nov 05 2016 05:32
@XkyFox: add it to your h2 element same way you did it to your p element.
Johnny
@JohnnyBizzel
Nov 05 2016 05:32
@coffeebeanzz Who by? was the question
Clint
@XkyFox
Nov 05 2016 05:32
doing it now
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:34
@WhiteLeaf1103 by someone on the FCC core team
Clint
@XkyFox
Nov 05 2016 05:34

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

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

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

<h2 font-family: Monospace; class="red-text">CatPhotoApp</h2>

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

somethings not workin
BOOM got it
thanks @cdrainxv
CamperBot
@camperbot
Nov 05 2016 05:36
xkyfox sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:cookie: 732 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Michael
@webdemon1
Nov 05 2016 05:37
the fist line? @XkyFox
__mifflin__
@cdrainxv
Nov 05 2016 05:38

@XkyFox: No… do it the same way you did this:

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

it should be like this:

h2 {
 font-family: Lobster;
}
Luis
@luixherbfriend
Nov 05 2016 05:39
I need to 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 the cat photo. i got this : <style>
. thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
</style>

where is suppose to be written this is what i have:

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

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

h2 {
font-family: Lobster, Monospace;
}

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

.smaller-image {
width: 100px;
}

</style>

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

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

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

__mifflin__
@cdrainxv
Nov 05 2016 05:41
@luixherbfriend: You want to put that border around the img… therefore add the class thick-green-border to your img element.
amankumayu
@amankumayu
Nov 05 2016 05:42
@luixherbfriend use
.thick-green-border
{
border:10px green solid;
}
@luixherbfriend use the class to img tag
@luis <img class="thick-green-border">
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:44
@luixherbfriend place anywhere between the existing style tags and add class to the img^
Supergood
@supergoods
Nov 05 2016 05:44
where we put the img class?
c0d0er
@c0d0er
Nov 05 2016 05:45
@walidashri thanks
CamperBot
@camperbot
Nov 05 2016 05:45
c0d0er sends brownie points to @walidashri :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave walidashri points
Supergood
@supergoods
Nov 05 2016 05:45
@amankumayu where we put the img class?
amankumayu
@amankumayu
Nov 05 2016 05:46
@supergoods <img class="thick-green-border"></img>
WhiteLeaf1103
@WhiteLeaf1103
Nov 05 2016 05:48
@coffeebeanzz Thank you
CamperBot
@camperbot
Nov 05 2016 05:48
whiteleaf1103 sends brownie points to @coffeebeanzz :sparkles: :thumbsup: :sparkles:
:star2: 1251 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
Supergood
@supergoods
Nov 05 2016 05:49
@amankumayu I m asking abt img class definition
to resize the image
YASS
@FERMAT1991
Nov 05 2016 05:51
is any one knows how to change the single quote to the double quote i type double quote alot this will make type faster
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:51
You're welcome @WhiteLeaf1103 :)
Earlan Saspa
@saspaearlan
Nov 05 2016 05:51
Hello guys!
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:52
where do you put the style for an img at? inside the style tags arleady there or on a new line?
Earlan Saspa
@saspaearlan
Nov 05 2016 05:52
I need some help.
YASS
@FERMAT1991
Nov 05 2016 05:52
@saspaearlan hey Earlan
Earlan Saspa
@saspaearlan
Nov 05 2016 05:52
My challenge is telling me to do this
Create a script element making sure it is valid and has a closing tag.
What do you mean by that?
Luis
@luixherbfriend
Nov 05 2016 05:52
thank you @coffeebeanzz @amankumayu :clap:
CamperBot
@camperbot
Nov 05 2016 05:52
luixherbfriend sends brownie points to @coffeebeanzz and @amankumayu :sparkles: :thumbsup: :sparkles:
:cookie: 3 | @amankumayu |http://www.freecodecamp.com/amankumayu
:star2: 1252 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
Earlan Saspa
@saspaearlan
Nov 05 2016 05:53
am I thinking too hard? lol
YASS
@FERMAT1991
Nov 05 2016 05:53
@saspaearlan <script type="text/javascript"></script>
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:54
@Jacktheknave inside the style tags already there. But you're just putting the class definition. Next you will add that class to the img tag
WhiteLeaf1103
@WhiteLeaf1103
Nov 05 2016 05:54
How can I center my thumb-nail?
Scancelm
@Scancelm
Nov 05 2016 05:55

Hello, i need help... <style>
.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>

Earlan Saspa
@saspaearlan
Nov 05 2016 05:55
@FERMAT1991 OMG I guess I was thinking too hard. Got it thanks!
CamperBot
@camperbot
Nov 05 2016 05:55
saspaearlan sends brownie points to @fermat1991 :sparkles: :thumbsup: :sparkles:
:cookie: 186 | @fermat1991 |http://www.freecodecamp.com/fermat1991
coffeebeanzz
@coffeebeanzz
Nov 05 2016 05:56
@luixherbfriend you're welcome :)
Scancelm
@Scancelm
Nov 05 2016 05:56
Error is, Your h2 element should be red. But still not red
Jackie Richardson
@Jacktheknave
Nov 05 2016 05:56
@coffeebeanzz I have no idea what you just said..
YASS
@FERMAT1991
Nov 05 2016 05:58
@saspaearlan you're welcome
Landon M. Vogel
@landonv360
Nov 05 2016 06:00
Does anyone else just find themselves just watching all the corrected issues in here...lol
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:00
@Jacktheknave lol what have u tried?
Jackie Richardson
@Jacktheknave
Nov 05 2016 06:01
I know this is wrong i was guessing haha <img class=".smaller-image {width:500px;}"
@coffeebeanzz
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:03
@Jacktheknave the .smaller-image {width: 500px;} goes anywhere in the style tags
Jackie Richardson
@Jacktheknave
Nov 05 2016 06:05
and a script tag is what again
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:05
@Jacktheknave the class gets added in the html below the </style> tag, <img class="smaller-image"
oh rats not script i mean style. Lemme get on my puter and fix that
Michael
@webdemon1
Nov 05 2016 06:07
hha,when I stuck, I always think there maybe exists bugs @landonv360
Try but i can't
Anyone help, the h2 not becoming red color
Patrick Dougherty
@PatDough
Nov 05 2016 06:10
i have style=color:red CatPhotoApp whats wrong?
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:10
@Jacktheknave since I made a mess of that, I will pm you my solution
Patrick Dougherty
@PatDough
Nov 05 2016 06:12
help?
amankumayu
@amankumayu
Nov 05 2016 06:13
@luis mention @name for thankings
YASS
@FERMAT1991
Nov 05 2016 06:13
@landonv360 me
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:15
@Scancelm try deleting that extra space after the class name <h2 class ="red-text "> try <h2 class="red-text">
Burak
@BurakAy
Nov 05 2016 06:16

@PatDough ```

<h2 style="color: red">CatPhotoApp</h2>
```

@PatDough you're missing the quotes around color: red
YASS
@FERMAT1991
Nov 05 2016 06:17

@Scancelm i rewhrite it and it worked

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

Jackie Richardson
@Jacktheknave
Nov 05 2016 06:22
@coffeebeanzz thanks for help
CamperBot
@camperbot
Nov 05 2016 06:22
jacktheknave sends brownie points to @coffeebeanzz :sparkles: :thumbsup: :sparkles:
:star2: 1253 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
coffeebeanzz
@coffeebeanzz
Nov 05 2016 06:22
you're welcome @Jacktheknave :)
YASS
@FERMAT1991
Nov 05 2016 06:23
@WhiteLeaf1103 try this
<div class="col-xs-12">
<div class="thumbnail ">
Landon M. Vogel
@landonv360
Nov 05 2016 06:26
any help please- nest a text input element with this form example please...<form action="/submit-cat-photo"></form> Think I'm getting tired..mind has gone blank
Earlan Saspa
@saspaearlan
Nov 05 2016 06:26
guys for jquery, its asking me to do this $("button").addClass("animatedbounce"){}; my question is should I nest it with the button element? or in script?
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 06:27
can anyone explain to me that how a mixture of grid layout, for example col-xs-6 col-md-4
works
Landon M. Vogel
@landonv360
Nov 05 2016 06:27
@Raushanah meet @saspaearlan
Earlan Saspa
@saspaearlan
Nov 05 2016 06:28
@landonv360 hs?
ha?
Landon M. Vogel
@landonv360
Nov 05 2016 06:29
@saspaearlan think he had the same issue. Or something similiar
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 06:29
for example <div class = "col-xs-12 col-sm-6>,how this works?
Earlan Saspa
@saspaearlan
Nov 05 2016 06:29
@landonv360 sorry I think I missed the question I just logged in lol
@landonv360 about your question I think nesting is when you combine something in a single line
Brakket
@Brakket
Nov 05 2016 06:30
I have a question about the "import a google font" challenge.
Shukan Shayme
@hilarioestoya
Nov 05 2016 06:31
how to create class?
Brakket
@Brakket
Nov 05 2016 06:31
do you put the font wher <style> is? or where <h2> is?
Landon M. Vogel
@landonv360
Nov 05 2016 06:31
@saspaearlan thx but not sure what i did incorrect to the Q, but it wasn't working. ill post an example in a sec, still trying it...lol
CamperBot
@camperbot
Nov 05 2016 06:31
landonv360 sends brownie points to @saspaearlan :sparkles: :thumbsup: :sparkles:
:cookie: 103 | @saspaearlan |http://www.freecodecamp.com/saspaearlan
Landon M. Vogel
@landonv360
Nov 05 2016 06:32
how do i send brownies...still new....lol
Earlan Saspa
@saspaearlan
Nov 05 2016 06:32
@Brakket inside style
Brakket
@Brakket
Nov 05 2016 06:32
thx
Earlan Saspa
@saspaearlan
Nov 05 2016 06:32
@landonv360 send me your code
vanshaj kerni
@vanshaj-kerni
Nov 05 2016 06:32

Emphasize the text in your target4 button by adding HTML tags.
Make sure the text is otherwise unchanged. <script>
$(document).ready(function() {
$("#target1").css("color", "red");

$("#target4").html("<em> #target4 </em>");

});
</script>

can someone tell me if my code is rigt or not/
please?
MVtheOttoman
@MVtheOttoman
Nov 05 2016 06:33
Adding a default option in Switch statements is not working for me, Ive tried alot of possible ways and nothing....... help please?
Landon M. Vogel
@landonv360
Nov 05 2016 06:35
thanks @saspaearlan
CamperBot
@camperbot
Nov 05 2016 06:35
landonv360 sends brownie points to @saspaearlan :sparkles: :thumbsup: :sparkles:
:warning: landonv360 already gave saspaearlan points
vanshaj kerni
@vanshaj-kerni
Nov 05 2016 06:38

@vanshaj-kerni
Emphasize the text in your target4 button by adding HTML tags.
Make sure the text is otherwise unchanged. <script>
$(document).ready(function() {
$("#target1").css("color", "red");

$("#target4").html("<em> #target4 </em>");

});
</script>
can someone tell me if my code is rigt or not/
please?

Burak
@BurakAy
Nov 05 2016 06:39
@saspaearlan the width of the page is 12 columns. so when you use "col-xs-12" the column will take up a full width of the view on an xs (extra small) screen size. if you use "col-sm-6" that column will take up only half the view on a sm (small) screen size.

@saspaearlan
```

<div class="col-xs-12 col-sm-6">
<h1>Blah</h1>
</div>

<div class="col-xs-12 col-sm-6">

</div>

those two divs will be side by side on a sm screen since they are only 6 col width
but when the screen is viewed on an xs screen, the will each take up the full width and will stack on top of one another
da468id
@da468id
Nov 05 2016 06:45
Hello there im new to freecodecamp im now at stage 9 (coloring the text) but the text is not changing ( my code is <h2 stlye="color:red> can someone help me if its right or wrong?
Burak
@BurakAy
Nov 05 2016 06:45
@da468id you forgot a " after red
@da468id <h2 style="color: red">
da468id
@da468id
Nov 05 2016 06:47
ah thank you @BurakAy Burak
CamperBot
@camperbot
Nov 05 2016 06:47
da468id sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @burakay |http://www.freecodecamp.com/burakay
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 06:47
@BurakAy Thanks for your explanation, now I finally understand it
CamperBot
@camperbot
Nov 05 2016 06:47
hailtogodlikeflash sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 126 | @burakay |http://www.freecodecamp.com/burakay
Burak
@BurakAy
Nov 05 2016 06:49
@HailToGodLikeFlash I just realized I was typing in the wrong persons name while explaining that. Thankfully you saw it
@HailToGodLikeFlash you're welcome
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 06:50
@BurakAy lol, I thought someone might ask same question at that time
da468id
@da468id
Nov 05 2016 06:51
thank you @BurakAy it worked :smile:
CamperBot
@camperbot
Nov 05 2016 06:51
da468id sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:warning: da468id already gave burakay points
Burak
@BurakAy
Nov 05 2016 06:52
@da468id my pleasure!
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 06:53
@BurakAy so if I use for example :col-sm-offset-4 col-md-8 col-md-offset-3 after col-sm-x col-md-x, then it will padding the grid depend on whether is a medium screen or small screen, right?
Sohail Barat
@sohailbarat
Nov 05 2016 06:58

I have written code like this:

<button class="btn btn-block btn-primary">
<i class="fa fa-thums-up"> </i> Like</button>

but i am getting this erroe
error
Add an i element with the classes fa and fa-thumbs-up.
Your fa-thumbs-up icon should be located within the Like button.
Can anyone tell me where i am doing anything wrong ?
Emmanuel
@chriemma
Nov 05 2016 07:02
Please can somebody help me with this challenge www.freecodecamp.com/challenges/add-font-awesome-icons-to-our-buttons
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:03
@chriemma What is the problem you're encountering?
@sohailbarat We can chat in here about your code. This room might be better than CodeReview.
Did you see my message about spelling?
Emmanuel
@chriemma
Nov 05 2016 07:04
How will i add font awesome icons to my button
@NicksIdeaEngine How will i add font awesome icons to my button
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:05
You'll need to read the description for that module. It tells you what to do to add the buttons.
Nitin Goel
@nitinrgoyal
Nov 05 2016 07:05

@chriemma

<button…>
<i class=“fa fa-thumbs-up”> Like</i>
</button>

Burak
@BurakAy
Nov 05 2016 07:05
@HailToGodLikeFlash the screen size will change the layout of the grid
@sohailbarat you misspelled thumbs
Anes Rastic
@anesCode
Nov 05 2016 07:06
@chriemma <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up">Like</i></button>
Burak
@BurakAy
Nov 05 2016 07:06
@sohailbarat you have thums instead of thumbs
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:06
If you followed the steps in the description, you can also hop over to Font Awesome's website to get codes for specific icons.
Or get the answer from Anes :P
HailToGodLikeFlash
@HailToGodLikeFlash
Nov 05 2016 07:07
@BurakAy okay
Burak
@BurakAy
Nov 05 2016 07:08
@HailToGodLikeFlash this link helps a little visually with offsetting https://v4-alpha.getbootstrap.com/layout/grid/#example-offsetting-columns
@HailToGodLikeFlash or you can create a bunch of divs with various col classes and apply borders to those divs that way you can see them move around the grid
hajarerohit
@hajarerohit
Nov 05 2016 07:10
hey can anyone help me for challege no 72
i want to add div element with the class col-xs-4
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:11
@hajarerohit They aren't really numbered when looking at the map. What's the title of the challenge, and where are you bumping into problems?
hajarerohit
@hajarerohit
Nov 05 2016 07:12
i have 4 bootstrap button and now i want to add Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Jax
@jax11000
Nov 05 2016 07:12
anyone got a second to help me with this portfolio project, ive set a background image for my page and am trying to create a field for text to be written on
akilesh
@akileshv
Nov 05 2016 07:13
@hajarerohit you have to write <div class="col-xs-4">your code</div>
hajarerohit
@hajarerohit
Nov 05 2016 07:13
map name Use the Bootstrap Grid to Put Elements Side By Side
Burak
@BurakAy
Nov 05 2016 07:14
@jax11000 what's the issue you're having?
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:15
@hajarerohit Yeah you just need to make each button inside of a div element with the right class assigned.
hajarerohit
@hajarerohit
Nov 05 2016 07:15
Okay thanks Nick and akilesh
Jax
@jax11000
Nov 05 2016 07:16
@BurakAy when i try to put in a field on which to put text and things of that nature, it keeps wiping the background image of the edges of the screen. i want the background picture to stay still while the fields scroll
@BurakAy if that makes any sense
wzysb
@wzysb
Nov 05 2016 07:16
how to change the Font Size 16px? in which line?
anyone can help me ?
Jax
@jax11000
Nov 05 2016 07:17
@wzysb which challenge are you on?
Burak
@BurakAy
Nov 05 2016 07:17
can you post the link to your codepen here?
Renzo Damian
@redamart
Nov 05 2016 07:18
help
wzysb
@wzysb
Nov 05 2016 07:18
Change the Font Size of an Element
Jax
@jax11000
Nov 05 2016 07:18
@BurakAy i just started
Renzo Damian
@redamart
Nov 05 2016 07:18
i made a i element
Jax
@jax11000
Nov 05 2016 07:19
@wzysb can you show me the code you have?
wzysb
@wzysb
Nov 05 2016 07:20
@jax11000 p {
font-size:16px;
}
@jax11000
ishrakrifat
@ishrakrifat
Nov 05 2016 07:22

<h1>Hello World</h1>

<h2>CatPhotoApp</h2>
<!--as you are-->

<p>Hello Paragraph</p>

Jax
@jax11000
Nov 05 2016 07:23
@wzysb that seems to be fine to me
ishrakrifat
@ishrakrifat
Nov 05 2016 07:23
trying to comment out h1 and p element.is that correct?
Earlan Saspa
@saspaearlan
Nov 05 2016 07:23
guys why is this not working
<script>
$(document).ready(function() {
$("button").addClass("animated shake btn-primary");
$(".btn").addclass("animated shake");
$("#target1") .addClass("animated shake btn-primary");
});


</script>
nvm I think I got it
wzysb
@wzysb
Nov 05 2016 07:25

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

<h2 class="red-text">我家的猫咪</h2>

<p class="red-text">在大家心目中,猫是慵懒的可爱的化身,它可以睡饱了再起来吃饭,可以逗趣小耗子,可以卖得了萌,使得了坏,这样百变的小怪兽就集结在一只宠物上,怎能不惹人怜爱。</p>

<p>养动物有的时候,就是介于爱与恨之间,当你钦羡别人萌宠这么可爱的时候,你一定没有想过,狗狗和猫猫会到处拉屎,甚至会屯老鼠,啃鞋子,用爪子爬门,你不理它,它就挠你,你要对它发脾气,它会比你更来劲。所以,狗猫慎入,没有一定的准备,切勿随便去侍养动物。它们一旦认定你了,你就是它们的主人,如果你抛弃它们,它们必定心中重创。</p>
p {
font-size:16px;
}

Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:26

@wzysb The part at the end which shows as

p {
font-size: 16px;
}

This needs to be in between the <style></style> tags.

Burak
@BurakAy
Nov 05 2016 07:26
@jax11000 apply the background image to body instead of html
Emmanuel
@chriemma
Nov 05 2016 07:27
what is wrong please somebody help <label><input type="radio" name="indoor-outdoor"><div class="col-xs-6"> Indoor</div></label>
akilesh
@akileshv
Nov 05 2016 07:28
which problem ur working on
Jax
@jax11000
Nov 05 2016 07:30
@BurakAy why is it that these problems are so frustrating yet always have the simplest answers? lol thank you
CamperBot
@camperbot
Nov 05 2016 07:30
jax11000 sends brownie points to @burakay :sparkles: :thumbsup: :sparkles:
:cookie: 127 | @burakay |http://www.freecodecamp.com/burakay
Burak
@BurakAy
Nov 05 2016 07:33
@jax11000 no problem. you get it working? I know it can get frustrating sometimes.
akilesh
@akileshv
Nov 05 2016 07:34
@chriemma you write ur label inside div class col-xs-6 then write <label><input ....></label></div>
Jax
@jax11000
Nov 05 2016 07:36
@BurakAy yeah its no longer making those annyoing white margins on the sides and deleting the background. Just have a long road ahead for this portfolio project.
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:37
@jax11000 Long roads are fine, and if you dig in, stay curious, and push through it, you'll find future projects run more smoothly because you've already stumbled over a few blocks.
Jax
@jax11000
Nov 05 2016 07:39
@NicksIdeaEngine thanks for the encouragement
CamperBot
@camperbot
Nov 05 2016 07:39
jax11000 sends brownie points to @nicksideaengine :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @nicksideaengine |http://www.freecodecamp.com/nicksideaengine
Emmanuel
@chriemma
Nov 05 2016 07:43
@akhileshv please sorry i did not get you because i want to Nest each of my radio buttons inside its own div with the class col-xs-6.
@akhileshv show me small example
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:44
@chriemma YOu need to have your radio buttons in between the div elements, not the other way around.
So it's
<div class="your-class"><label><input>Indoor</input></label></div>
Nested means "inside of" or "contained within". So if your radio buttons are nested within your div elements, that means the div elements must be on the outside, not inside.
HTML is "First In, Last Out", which means elements that hold other elements inside of themselves are started first, but closed last.
akilesh
@akileshv
Nov 05 2016 07:47
@chriemma <div class="col-xs-6">
<label><input type="" name=""> Indoor</label>
</div>
<div class="col-xs-6">
<label><input type="" name=""> Outdoor</label>
</div>
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 07:51
Or you could copy the solution from akilesh
Mike Hu
@webaBaby
Nov 05 2016 08:00
Only use jQuery to add these classes to the element.
Any one know about this issue?
Emmanuel
@chriemma
Nov 05 2016 08:01
A big thanks to @akhileshv @NicksIdeaEngine
CamperBot
@camperbot
Nov 05 2016 08:01
chriemma sends brownie points to @akhileshv and @nicksideaengine :sparkles: :thumbsup: :sparkles:
:cookie: 271 | @akhileshv |http://www.freecodecamp.com/akhileshv
:cookie: 273 | @nicksideaengine |http://www.freecodecamp.com/nicksideaengine
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:03
hey everyone how do I add my code here in the chat ?
Jiang Xiao
@nerohoop
Nov 05 2016 08:03
can someone help me with the quote project? I can’t change the background color
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:08
@filigithub Add three of those backquote marks (the button above the tab key and below the escape key). Put the three marks on their own lines both before and after your code. So you'll have ``` on the line before and on the line after your code. Like this:
if (code => 5) {
console.log("Code is greater than or equal to five.");
}
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:12
@NicksIdeaEngine aaaaa I am not glad to hear that because i have an Italian keybaord and we don't have those backquote marks. Same issue I had on treehouse, I am going surf google to see if I find a quick solution
well a copy and paste from your message will do I reckon
Sorin Ruse
@sorinr
Nov 05 2016 08:13
@nerohoop try $("html body").css(bg color here)
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:13
(copy and paste of your backquote marks)
Nikos Danaj
@NIkolasDanaj
Nov 05 2016 08:13
good morning
Emmanuel
@chriemma
Nov 05 2016 08:13
what is wrong here <label><div class="col-xs-4"><input type="checkbox" name="personality"> Loving</label></div>it says that i should Nest each of your checkboxes inside its own div with the class col-xs-4.
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:14
Your label element came before the div element, but ended first
"First In, Last Out", not "First In, First Out"
Testing
Do you have the squiggly marks? ~~~
Nikos Danaj
@NIkolasDanaj
Nov 05 2016 08:15

guys i have 1 question, i am in chapter "Turn an image into a link"

Nest the existing img element within an a element. .

<a href="#" ><img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera. "> </a>
what is the problem in this code?
Emmanuel
@chriemma
Nov 05 2016 08:16
@NicksIdeaEngine should my div element come first
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:17
Yes
I don't see a problem with the code @NIkolasDanaj is there more code to look at?
Emmanuel
@chriemma
Nov 05 2016 08:18
but look at what i what to do @NicksIdeaEngine Nest each of your checkboxes inside its own div with the class col-xs-4.
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:20
Yes, so nest your checkboxes (which means all code from <label> to </label>) inside a div element with the class assigned
It should be <div><label><input></label></div>
In that order, because div contains the whole thing, label starts the user interface, input makes the checkbox, then you close it all with FIrst In Last Out
Unless the challenge really does want the checkbox to be surrounded by a div element, but I'd sooner guess that it just means the overall input setup.
md miraj
@mdmiraj10
Nov 05 2016 08:30
how to uncomment html
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:31
So if you don't want it to be a comment, remove the surrounding parts of <!-- and -->
md miraj
@mdmiraj10
Nov 05 2016 08:33
u mean <h>.....</h>?
if i want to uncomment
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:33
I do not, but if you have your solution then go with that
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:34
hello everyone is there any sort of problem with my code in "target elements using Jquery" or it's a bug <script> $(document).ready(function() { $("button").addClass("animated bounce"); $(."well").addClass("animated shake"); $( "#target3" ).addClass("animated fadeOut"); }); </script>
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:35
It's ".well" not ."well"
md miraj
@mdmiraj10
Nov 05 2016 08:35

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

Filippo D'Arrigo
@filigithub
Nov 05 2016 08:36
thanks a lot @NicksIdeaEngine
CamperBot
@camperbot
Nov 05 2016 08:36
filigithub sends brownie points to @nicksideaengine :sparkles: :thumbsup: :sparkles:
:cookie: 274 | @nicksideaengine |http://www.freecodecamp.com/nicksideaengine
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:37
@mdmiraj10 That means you need to delete <!-- and --> that surround the elements you're suppose to uncomment
@filigithub You're welcome!
md miraj
@mdmiraj10
Nov 05 2016 08:38
thnx
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:39
how do i send brownie points? @camperbot
(by typing "thanks @yourname") ?, @camperbot
Emmanuel
@chriemma
Nov 05 2016 08:41
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:43
@filigithub Yes. Saying thanks or thank you after tagging them does it
CamperBot
@camperbot
Nov 05 2016 08:43
nicksideaengine sends brownie points to @filigithub :sparkles: :thumbsup: :sparkles:
:cookie: 105 | @filigithub |http://www.freecodecamp.com/filigithub
Filippo D'Arrigo
@filigithub
Nov 05 2016 08:43
@NicksIdeaEngine thanks
CamperBot
@camperbot
Nov 05 2016 08:43
filigithub sends brownie points to @nicksideaengine :sparkles: :thumbsup: :sparkles:
:warning: filigithub already gave nicksideaengine points
Nick Garcia
@NicksIdeaEngine
Nov 05 2016 08:44
@chriemma The second paragraph of the description really breaks down what you need to do. Find those parts of your code first, then go through it sentence by sentence until it's complete.
Jeff Shapiro
@Jeff-Shapiro
Nov 05 2016 08:49
@NicksIdeaEngine easier to get the solution from you than read
Andrew
@redento
Nov 05 2016 08:59
Hey all
this is have, learn Java?
Huargh
@Huargh
Nov 05 2016 09:04
Hi @redento , in FreeCodeCamp you're about to learn mostly about HTML, CSS and Javascript. You won't find too many Java resources here
Andrew
@redento
Nov 05 2016 09:06
yes
i want learn java/
walcott21
@walcott21
Nov 05 2016 09:10
hello
Emphasize the text in your target4 button by adding HTML tags.
Make sure the text is otherwise unchanged.
$("#target4").html("<em>jQuery Playground</em>");
can someone tell me what's wrong here ?
Lloyd Ruskin
@lsruskin
Nov 05 2016 09:11
@redento Javascript is one path to learning Java. It's a good starting point.
Jeff Shapiro
@Jeff-Shapiro
Nov 05 2016 09:13
@lsruskin said no one ever
Andrew
@redento
Nov 05 2016 09:14
Я уже изучаю джаву, просто думал тут есть курсы по ней
Jeff Shapiro
@Jeff-Shapiro
Nov 05 2016 09:14
@redento if you want to learn java your in the wrong place
Andrew
@redento
Nov 05 2016 09:14
@Jeff-Shapiro yes, ty all!!! See ya
CamperBot
@camperbot
Nov 05 2016 09:14
redento sends brownie points to @jeff-shapiro :sparkles: :thumbsup: :sparkles:
:cookie: 306 | @jeff-shapiro |http://www.freecodecamp.com/jeff-shapiro
Jeff Shapiro
@Jeff-Shapiro
Nov 05 2016 09:15
@redento tutorialpoint may teach you java
Andrew
@redento
Nov 05 2016 09:15
Jeff, u can say, suite with tutorial teach java
Lloyd Ruskin
@lsruskin
Nov 05 2016 09:19
@redento The point is this: if you have basic programming skills already you can learn another language. Check out articles on computer languages on medium.com that discuss this. You will benefit from learning more than one language to compare between them. FreeCodeCamp focusses on javascript initially where there are many web design job opportunities.
Jeff Shapiro
@Jeff-Shapiro