These are chat archives for FreeCodeCamp/Help

6th
Jan 2017
Anh Nguyen
@tiremon112
Jan 06 2017 00:00
where you put Twitter icon and credit of author
Brian
@A4Coding
Jan 06 2017 00:00
once*
Anh Nguyen
@tiremon112
Jan 06 2017 00:00
i mean located at bottom of webpage
Evan Kalvis
@evan17gr
Jan 06 2017 00:00
@tiremon112 just make a footer and inside it put a div with a ul and lis
@tiremon112 do u mean like this https://codepen.io/evan17gr/full/aBqvGz/
or do u actually mean like a nvabr?
Anh Nguyen
@tiremon112
Jan 06 2017 00:02
yea the bottom
black one
where you put pic
and allright reserved
Evan Kalvis
@evan17gr
Jan 06 2017 00:04
@tiremon112 just take a look at it and try make it by urself
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:05
@tiremon112 I would just create <div class="footer"> for the footer with author credits etc.
@tiremon112 inspect an element with dev tools and review it and try.
Mostafa Masri
@thefakeweed
Jan 06 2017 00:06

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

help pls
CamperBot
@camperbot
Jan 06 2017 00:06
no wiki entry for: pls
Evan Kalvis
@evan17gr
Jan 06 2017 00:09
@mml3b .smaller-image{width:100px} u forgot something here
and also u need to add the clas sto the img
Phillip
@psnider22
Jan 06 2017 00:10

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

Mostafa Masri
@thefakeweed
Jan 06 2017 00:10
@evan17gr something has to do with this ? img src
Phillip
@psnider22
Jan 06 2017 00:10
Use rgb for the color red.... havent i done that?
Evan Kalvis
@evan17gr
Jan 06 2017 00:10
@mml3b u forgot a ;
and after that u nee dto assign the class to the img
Anh Nguyen
@tiremon112
Jan 06 2017 00:10
@KasiaNyczek Thanks just made a class footer. It seem working well. Also there is a footer element, but i can't make it work.
CamperBot
@camperbot
Jan 06 2017 00:10
tiremon112 sends brownie points to @kasianyczek :sparkles: :thumbsup: :sparkles:
:cookie: 98 | @kasianyczek |http://www.freecodecamp.com/kasianyczek
Evan Kalvis
@evan17gr
Jan 06 2017 00:11
@psnider22 u need to add ; at the ends
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:11
@psnider22 you have missed something in styles
Phillip
@psnider22
Jan 06 2017 00:11
@evan17gr @KasiaNyczek thanks lol
CamperBot
@camperbot
Jan 06 2017 00:11
psnider22 sends brownie points to @evan17gr and @kasianyczek :sparkles: :thumbsup: :sparkles:
:cookie: 382 | @evan17gr |http://www.freecodecamp.com/evan17gr
:cookie: 99 | @kasianyczek |http://www.freecodecamp.com/kasianyczek
Mostafa Masri
@thefakeweed
Jan 06 2017 00:12

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

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

how to "assign the class to the img" ? exactly
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:12
@tiremon112 what element?
Anh Nguyen
@tiremon112
Jan 06 2017 00:13
<footer> element
i google it and it is a thing
:smile:
i mean tag
Evan Kalvis
@evan17gr
Jan 06 2017 00:13
yes it is
@mml3b whats the img src?
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:14
@mml3b img src {
width:100px}; is wrong - you have to fix it
Evan Kalvis
@evan17gr
Jan 06 2017 00:14
u have make a class called smaller-image
njordan
@njordan00
Jan 06 2017 00:14

<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target1").prop("disabled", true);
$("#target4").remove();
$("#target2").appendTo("#right-well");
$("#target5").clone().appendTo("#left-well");
$("#target1").parent().css("background-color", "red");
$("#right-well").children().css("color", "orange");
$(".target:nth-child(2)").addClass("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>
Can anyone tell me how to make The second element in the target elements bounce? is my code wrong?

CoryCMyers
@CoryCMyers
Jan 06 2017 00:15
@CoryCMyers
Okay, so I have most of the layout nailed down for my tribute page can anyone help me out with getting the scroll bars set to be the same height as the central picture, and keeping them so dynamically? I have tried setting it as a, and as rows, but I am unable to get these scroll bars sized properly without setting them at a hard pixel height. Which will shift on whether or not things match up with the size of the device looking at it yes?
https://codepen.io/CoryCMyers/pen/dNParP/
Any help would be VASTLY appreciated
Mostafa Masri
@thefakeweed
Jan 06 2017 00:16
i created the class buttt

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

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

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

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

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

how to assign the class to the img ?
Anh Nguyen
@tiremon112
Jan 06 2017 00:17
@njordan00 animated bounce?
CoryCMyers
@CoryCMyers
Jan 06 2017 00:17
class="class here"
Anh Nguyen
@tiremon112
Jan 06 2017 00:17
try it if see it work
CoryCMyers
@CoryCMyers
Jan 06 2017 00:17
I know the margins on the left hand hold through a lot of that, it is how i got through it.
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:18
@mml3b try <img class="">
David Naimi
@d88naimi
Jan 06 2017 00:18

<input type="text" placeholder="cat photo URL">
<form action="/submit-cat-photo"></form>
Nest your text input element within a form element. Confused on how I should nest this???
thankyou
Evan Kalvis
@evan17gr
Jan 06 2017 00:19
@d88naimi do u understand what nest means?
njordan
@njordan00
Jan 06 2017 00:20
@tiremon112 thanks mate
CamperBot
@camperbot
Jan 06 2017 00:20
njordan00 sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
:cookie: 124 | @tiremon112 |http://www.freecodecamp.com/tiremon112
David Naimi
@d88naimi
Jan 06 2017 00:20
@evan17gr little kinda when we merge the code into one
Mostafa Masri
@thefakeweed
Jan 06 2017 00:20
its not working :/ i give up
can somebody do it ?
Anh Nguyen
@tiremon112
Jan 06 2017 00:21
what not work
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:21
@mml3b don't give up, try again
Evan Kalvis
@evan17gr
Jan 06 2017 00:21
@d88naimi u put an element inside another element
@d88naimi so u basically need to put the input element inside the form element
give it a try
Mostafa Masri
@thefakeweed
Jan 06 2017 00:22
tbh i dont know how to put the codes properly and which one before the other , thats my problem , im always lost and dont know priorities and stuff
is it normal to be stuck on this level ? or nobody gets stuck usualy
Evan Kalvis
@evan17gr
Jan 06 2017 00:22
yes its normal
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:23
@d88naimi you have an element with opening <> and closing </> tabs, nesting means you put other elements inside.
Evan Kalvis
@evan17gr
Jan 06 2017 00:23
@mml3b so u made that class called smaller-image and now u want to assign it to the img so it has an effect on it
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:24
@mml3b you will get stuck often, it is normal. Take a short break and come back to the task :)
Evan Kalvis
@evan17gr
Jan 06 2017 00:24
use the class="thenameoftheclass"
Anh Nguyen
@tiremon112
Jan 06 2017 00:24
@evan17gr evan is it possible to make the Font awesome icon appear without put text in it ?
Evan Kalvis
@evan17gr
Jan 06 2017 00:24
@tiremon112 wdym?
Mostafa Masri
@thefakeweed
Jan 06 2017 00:24
i reseted it i will start from beginning
Pedro
@Itzpdoe
Jan 06 2017 00:24
@evan17gr hmm working on a background now
Anh Nguyen
@tiremon112
Jan 06 2017 00:25
you know the class fa right to make twitter icon and linked
Pedro
@Itzpdoe
Jan 06 2017 00:25
http://codepen.io/itzpdoe/pen/apzXYP @evan17gr look more cleaned up?
Evan Kalvis
@evan17gr
Jan 06 2017 00:25
fa fa-twitter
Aaron Williams
@atrainbtown
Jan 06 2017 00:25
can anyone help me with hex codes?
Evan Kalvis
@evan17gr
Jan 06 2017 00:25
@Itzpdoe so what do u want to do with the background?
Anh Nguyen
@tiremon112
Jan 06 2017 00:25
yea that
CoryCMyers
@CoryCMyers
Jan 06 2017 00:25
@atrainbtown For colors?
Aaron Williams
@atrainbtown
Jan 06 2017 00:26
yea
Evan Kalvis
@evan17gr
Jan 06 2017 00:26
@tiremon112 so u want to have text with it?
Pedro
@Itzpdoe
Jan 06 2017 00:26
@evan17gr add a picture im thinking http://meganlynnkott.tumblr.com/image/125684293853
Anh Nguyen
@tiremon112
Jan 06 2017 00:26
no i want it to appear icon only
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:26
@mml3b if you think all is ok with your code check comas, semi-colons, if they are ok. Usually they are not!
Aaron Williams
@atrainbtown
Jan 06 2017 00:26
Give your h1 element with the text I am red! the color red.
Use the hex code for the color red instead of the word red.
Give your h1 element with the text I am green! the color green.
Use the hex code for the color green instead of the word green.
CoryCMyers
@CoryCMyers
Jan 06 2017 00:26
@atrainbtown But I normally just google the color I want and steal the hex code from there
Evan Kalvis
@evan17gr
Jan 06 2017 00:26
@Itzpdoe the whole page or just a div?
Pedro
@Itzpdoe
Jan 06 2017 00:27
Whole page.
@evan17gr
Anh Nguyen
@tiremon112
Jan 06 2017 00:27
@evan17gr i want it to appear the icon only and then i put an anchor element in it.
Aaron Williams
@atrainbtown
Jan 06 2017 00:27
<style>
  .red-text {
    color: black;
  }
  .green-text {
    color: black;
  }
  .dodger-blue-text {
    color: black;
  }
  .orange-text {
    color: black;
  }
</style>

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

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

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

<h1 class="orange-text">I am orange!</h1>
Pedro
@Itzpdoe
Jan 06 2017 00:27
is there a way to move the image around also? so the deer's arnt in the middle of the words. Maybe moved off to the side.
@evan17gr
CoryCMyers
@CoryCMyers
Jan 06 2017 00:27
@atrainbtown The codes you need should be on the left side of the screen
Aaron Williams
@atrainbtown
Jan 06 2017 00:27
how do i use hex codes to change the text color??
they are
but where do i put them in?
under the <style>
?
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:28
@atrainbtown use this .red-text {
color: #FF0000;
}
Evan Kalvis
@evan17gr
Jan 06 2017 00:28
@Itzpdoe not with html or css
but u can do this background:url("http://meganlynnkott.tumblr.com/image/125684293853";no-repeat center center-fixed;
Pedro
@Itzpdoe
Jan 06 2017 00:28
@evan17gr hmm. Okay. Well that picture might not work then
i'll see how it looks
Evan Kalvis
@evan17gr
Jan 06 2017 00:28
add that to the body{}
@tiremon112 dont u want the icon do be the link to u twitter?
Aaron Williams
@atrainbtown
Jan 06 2017 00:29
@KasiaNyczek nothing after "black;"
Anh Nguyen
@tiremon112
Jan 06 2017 00:30
@evan17gr add what to the body
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:30
@atrainbtown just replace word black with #...... - proper color number
Pedro
@Itzpdoe
Jan 06 2017 00:30
@evan17gr nah doesnt work
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:30
@atrainbtown delete black
Evan Kalvis
@evan17gr
Jan 06 2017 00:30
@tiremon112 nah only the second sentence was for u
Aidan M
@AIDXNZ
Jan 06 2017 00:31
How do I pass this challenge? "Between the style tags, give the p elements font-size of 16px. Browser and Text zoom should be at 100%." I'm supposed to do this. "Inside the same <style> tag that contains your red-text class, create an entry for p elements and set the font-size to 16 pixels (16px)." Please help. This is my code

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

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

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

David Naimi
@d88naimi
Jan 06 2017 00:31
@KasiaNyczek @evan17gr thank you
CamperBot
@camperbot
Jan 06 2017 00:31
d88naimi sends brownie points to @kasianyczek and @evan17gr :sparkles: :thumbsup: :sparkles:
:cookie: 100 | @kasianyczek |http://www.freecodecamp.com/kasianyczek
:cookie: 383 | @evan17gr |http://www.freecodecamp.com/evan17gr
Lauri Välja
@OFFLlNE
Jan 06 2017 00:31
@AIDXNZ huh... take away that font-size from html <p> and just remove the thing you have done in css too atm
Aidan M
@AIDXNZ
Jan 06 2017 00:32
@OFFLlNE kk thanks
CamperBot
@camperbot
Jan 06 2017 00:32
aidxnz sends brownie points to @offllne :sparkles: :thumbsup: :sparkles:
:cookie: 453 | @offllne |http://www.freecodecamp.com/offllne
Lauri Välja
@OFFLlNE
Jan 06 2017 00:32
and try to use the example done with h2 to style your p
Evan Kalvis
@evan17gr
Jan 06 2017 00:32
@Itzpdoe that picture isnt working
Sam Griffen
@ssgriffen
Jan 06 2017 00:32
Anyone know why my links arent working? http://codepen.io/ssgriffen/pen/VmOKEp
Evan Kalvis
@evan17gr
Jan 06 2017 00:32
when i use a random picture it works
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:32
@atrainbtown there should be a list of colors to be implemented in the task as far as I recall
Pedro
@Itzpdoe
Jan 06 2017 00:32
@evan17gr hmm okay. Well no worries.
Lauri Välja
@OFFLlNE
Jan 06 2017 00:33
@ssgriffen what links?
Pedro
@Itzpdoe
Jan 06 2017 00:33
@evan17gr i'd probably have to change the background color and stuff so i'll just leave it as it.
Evan Kalvis
@evan17gr
Jan 06 2017 00:33
@Itzpdoe maybe try to uplaod the picture to imgsafe for example
Sam Griffen
@ssgriffen
Jan 06 2017 00:33
@OFFLlNE Click on the names of the profiles
Anh Nguyen
@tiremon112
Jan 06 2017 00:33
i forgot to add this to my html no wonder why <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
i see nothing lol
Lauri Välja
@OFFLlNE
Jan 06 2017 00:33
@ssgriffen clicking on names works for me
Evan Kalvis
@evan17gr
Jan 06 2017 00:34
Lauri Välja
@OFFLlNE
Jan 06 2017 00:34
you mean that the twitch is all white and does not display anything? This is codepen stuff, just ignore that
Aaron Williams
@atrainbtown
Jan 06 2017 00:34
@KasiaNyczek yes i got half of it done!
Sam Griffen
@ssgriffen
Jan 06 2017 00:34
@OFFLlNE Ohh okay that eases some stress...are you sure tho?
Aaron Williams
@atrainbtown
Jan 06 2017 00:34
says i need to change the word red to the hexcode
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:35
@atrainbtown
Color Hex Code
Dodger Blue #2998E4
Green #00FF00
Orange #FFA500
Red #FF0000
Lauri Välja
@OFFLlNE
Jan 06 2017 00:35
@ssgriffen yah. As long as it pops a new window with correct URL you are good
Mostafa Masri
@thefakeweed
Jan 06 2017 00:35

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

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

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

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

<img src class="smaller-image">

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

goshh
Lauri Välja
@OFFLlNE
Jan 06 2017 00:35
you can copy that URL and throw that into a new tab yourself to see if this URl is legit
Sam Griffen
@ssgriffen
Jan 06 2017 00:35
@OFFLlNE Alright..Hows my JS...look okay to you so far..?
Lauri Välja
@OFFLlNE
Jan 06 2017 00:36
@mml3b you are using still the larger image size..
ahhterrence
@ahhterrence
Jan 06 2017 00:36
<style>
h2 {color: blue;}
</style>
how do i make my text blue
Lauri Välja
@OFFLlNE
Jan 06 2017 00:36
@ssgriffen ah seems fine, looks very ugly, but mine was probably more uglier :D This twitch api workaround is just massive stressball
sometimes it gets the requested data and sometimes does not
Aaron Williams
@atrainbtown
Jan 06 2017 00:37
thanks @KasiaNyczek
CamperBot
@camperbot
Jan 06 2017 00:37
atrainbtown sends brownie points to @kasianyczek :sparkles: :thumbsup: :sparkles:
:cookie: 101 | @kasianyczek |http://www.freecodecamp.com/kasianyczek
Anh Nguyen
@tiremon112
Jan 06 2017 00:37
@evan17gr thank fam it working now, no wonder i made no sense =]
CamperBot
@camperbot
Jan 06 2017 00:37
tiremon112 sends brownie points to @evan17gr :sparkles: :thumbsup: :sparkles:
:cookie: 384 | @evan17gr |http://www.freecodecamp.com/evan17gr
Lauri Välja
@OFFLlNE
Jan 06 2017 00:37
so I just tried to do the user stories asap and move on
Crazycatt316
@Crazycatt316
Jan 06 2017 00:37
Nest your text input element within a form element.
Sam Griffen
@ssgriffen
Jan 06 2017 00:37
@OFFLlNE Ya I need work on making it look better...
@OFFLlNE thanks for the help tho
CamperBot
@camperbot
Jan 06 2017 00:37
ssgriffen sends brownie points to @offllne :sparkles: :thumbsup: :sparkles:
:cookie: 454 | @offllne |http://www.freecodecamp.com/offllne
Crazycatt316
@Crazycatt316
Jan 06 2017 00:38

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

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

Lauri Välja
@OFFLlNE
Jan 06 2017 00:38
Like you need to use 3 different api calls which was annoying for me :D
Noah Harness
@Harnessn
Jan 06 2017 00:38
Hey I need some help on the js challenge "Manipulating Complex Objects", specifically where to include the new array.
Lauri Välja
@OFFLlNE
Jan 06 2017 00:38
@ssgriffen incase you want to check my awfulness :D
Evan Kalvis
@evan17gr
Jan 06 2017 00:38
@tiremon112 no problem
Noah Harness
@Harnessn
Jan 06 2017 00:39
Where do i include the new album?
Evan Kalvis
@evan17gr
Jan 06 2017 00:39
@OFFLlNE whats up guys ist anomaly from sweden
Anh Nguyen
@tiremon112
Jan 06 2017 00:39
@OFFLlNE look good you could be a next Bill Gate
Noah Harness
@Harnessn
Jan 06 2017 00:39
blob
Lauri Välja
@OFFLlNE
Jan 06 2017 00:39
@evan17gr its ya boiii anomaly from swedään :joy:
uuu. STPeach is streaming... guess got to watch that before heading to bed :D
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:40
@mml3b try this <img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Evan Kalvis
@evan17gr
Jan 06 2017 00:40
@OFFLlNE well as long as its functioning well its fine
Lauri Välja
@OFFLlNE
Jan 06 2017 00:40
damn, did not think I will actually find use for it
@evan17gr it should not function well :D
when I finished it, like every 3rd RUN would make it work. 2/3 it couldn't get some of the data out from API and got an error somewhere
Mostafa Masri
@thefakeweed
Jan 06 2017 00:41

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

i will try this it hsould work ( class name is smaller-image )
it worked :) Thx guys
Evan Kalvis
@evan17gr
Jan 06 2017 00:42
@OFFLlNE yes but thats not ur fault?
Mostafa Masri
@thefakeweed
Jan 06 2017 00:42
enough learning for tday :+1:
Evan Kalvis
@evan17gr
Jan 06 2017 00:42
i ve heard that this challenge is really messy
KasiaNyczek
@KasiaNyczek
Jan 06 2017 00:43
night guys
Lauri Välja
@OFFLlNE
Jan 06 2017 00:43
I think maybe I could've made that like that so it will not get errors, but I just did not like that workaround API so I thought just let it be and move on w/ my life :D
Aaron Williams
@atrainbtown
Jan 06 2017 00:43

<style>
 .red-text {
    color:#FF0000
  }
  .green-text {
    color:#00FF00
  }
  .dodger-blue-text {
    color:#2998E4
  }
  .orange-text {
    color:#FFA500
  }
</style>

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

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

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

<h1 class="orange-text">I am orange!</h1>
use hex code to replace word "red"
where do i enter the hex code???
__mifflin__
@cdrainxv
Jan 06 2017 00:44
@atrainbtown: Missing ; for all the colors.
color:#FF0000; etc
Evan Kalvis
@evan17gr
Jan 06 2017 00:44
@OFFLlNE lol
Lauri Välja
@OFFLlNE
Jan 06 2017 00:44
aight peeps, I will also get myself to bed. Good nite, c u tomorrow
Aaron Williams
@atrainbtown
Jan 06 2017 00:44
THANKS @cdrainxv
CamperBot
@camperbot
Jan 06 2017 00:44
atrainbtown sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1956 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Evan Kalvis
@evan17gr
Jan 06 2017 00:45
@OFFLlNE good night!
Phillip
@psnider22
Jan 06 2017 00:45

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

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

<p>Things cats love:</p>
<ul>

liveinthemind
@liveinthemind
Jan 06 2017 00:45
I feel like I'm missing something really obvious with CSS Class to style
Phillip
@psnider22
Jan 06 2017 00:45
i have the src right dont I?
Gustave Nishimirwe
@gustavebn
Jan 06 2017 00:46
what do I do here? Your first radio button on your form should be checked by default.
the directions on here are never clear enough
ryan
@HY-ryan
Jan 06 2017 00:46
having a bit of trouble with the nuts and bolts of the random quote generator, anyone know a good reference on jquery/ajax?
__mifflin__
@cdrainxv
Jan 06 2017 00:47
@psnider22: Yes… but it's not inside the img element:
<img src="…" class="img-responsive">
Sander Berntsen
@sbxn14
Jan 06 2017 00:47
hey guys I would really like to get my header to look like the picture on here https://blackrockdigital.github.io/startbootstrap-agency/ (with my own picture) but I cannot for the life of me figure out how I get it to be the entire width and sufficient height for it to look great and so I can go over into another section afterwards. http://codepen.io/sbxn14/pen/egmKRr?editors=1100 could someone help me?
Phillip
@psnider22
Jan 06 2017 00:47
@gustavebn you need to add the word "checked" into the code
__mifflin__
@cdrainxv
Jan 06 2017 00:48
@gustavebn: How is it not clear? Just add the word checked to your first radio button.
Gustave Nishimirwe
@gustavebn
Jan 06 2017 00:48
I'm inputting name= "checked" but it is not communicating
Manish Giri
@Manish-Giri
Jan 06 2017 00:48
@gustavebn show code.
Phillip
@psnider22
Jan 06 2017 00:49
@cdrainxv thanks!
CamperBot
@camperbot
Jan 06 2017 00:49
psnider22 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1957 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Gustave Nishimirwe
@gustavebn
Jan 06 2017 00:49
Oh, that was it??? thanks @cdrainxv
CamperBot
@camperbot
Jan 06 2017 00:49
gustavebn sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1958 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Gustave Nishimirwe
@gustavebn
Jan 06 2017 00:50
im making it too difficult for myself. lol
Evan Kalvis
@evan17gr
Jan 06 2017 00:50
@sbxn14 background: url("https://ibin.co/37tPipsGYOaj.jpg"); no-repeat center center-fixed;
Anh Nguyen
@tiremon112
Jan 06 2017 00:51
@evan17gr what does that do
Sam Griffen
@ssgriffen
Jan 06 2017 00:51
@OFFLlNE holy shit haha Not the way I did it at all...but I guess the endpoint workaround has changed alot.
Bradley420
@Bradley420
Jan 06 2017 00:52
How do I create a new class "smaller image" confused rn
Anh Nguyen
@tiremon112
Jan 06 2017 00:52
lol
Evan Kalvis
@evan17gr
Jan 06 2017 00:52
@tiremon112 which part?
Anh Nguyen
@tiremon112
Jan 06 2017 00:52
no repear
Bradley420
@Bradley420
Jan 06 2017 00:52
like the first part
Anh Nguyen
@tiremon112
Jan 06 2017 00:52
no repeat* and center -fixed @evan17gr
Evan Kalvis
@evan17gr
Jan 06 2017 00:52
so the background doesnt repeat if its too small
Anh Nguyen
@tiremon112
Jan 06 2017 00:53
@Bradley420 lol, you just make a .smaller-image{} in your style element lul
Noah Harness
@Harnessn
Jan 06 2017 00:53
I don't know how to add another album to this array as specified by the instructions. been struggling on it for awhile now.
blob
Hello911
@Hello911
Jan 06 2017 00:53
@KasiaNyczek Thank u I got it
CamperBot
@camperbot
Jan 06 2017 00:53
hello911 sends brownie points to @kasianyczek :sparkles: :thumbsup: :sparkles:
:cookie: 102 | @kasianyczek |http://www.freecodecamp.com/kasianyczek
Manish Giri
@Manish-Giri
Jan 06 2017 00:53
@Harnessn add your code after the comment
Noah Harness
@Harnessn
Jan 06 2017 00:54
@Manish-Giri I did its there just took awhile to upload. look at the highlighted part
Bradley420
@Bradley420
Jan 06 2017 00:54
@tiremon112 ok, thanks I mustve been mistyping something
CamperBot
@camperbot
Jan 06 2017 00:54
bradley420 sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @tiremon112 |http://www.freecodecamp.com/tiremon112
Manish Giri
@Manish-Giri
Jan 06 2017 00:54
@Harnessn you basically add another object to the array, so the structure looks like this
var myMusic = [
{
//album1 
}
,
{
//album 2 here
}
];
Sander Berntsen
@sbxn14
Jan 06 2017 00:55
@evan17gr its a bit too zoomed in for me right now tho. any way you can make it less zoomed in?
Evan Kalvis
@evan17gr
Jan 06 2017 00:58
@sbxn14 not really
Noah Harness
@Harnessn
Jan 06 2017 00:58
@Manish-Giri
Evan Kalvis
@evan17gr
Jan 06 2017 00:58
im not sure
Noah Harness
@Harnessn
Jan 06 2017 00:58
@Manish-Giri i GOT IT THANK YOU
CamperBot
@camperbot
Jan 06 2017 00:58
harnessn sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3575 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jan 06 2017 00:58
@Harnessn welcome
Sander Berntsen
@sbxn14
Jan 06 2017 00:58
@evan17gr damn :/
Vee55
@Vee55
Jan 06 2017 01:01
So I am stuck setting the font sizes at 16
Got it
tobylyons
@tobylyons
Jan 06 2017 01:02
<div class="silver-background">
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol> </div>
could someone explain why this hasn't made the background silver please?
Sander Berntsen
@sbxn14
Jan 06 2017 01:03
you need to also change it in CSS
```.silver-background { background-color: silver; }
Aaron Williams
@atrainbtown
Jan 06 2017 01:03
how do i nest all HTML in a "div" element?????
Sander Berntsen
@sbxn14
Jan 06 2017 01:04
.silver-background { background-color: silver; }
Manish Giri
@Manish-Giri
Jan 06 2017 01:04
@tobylyons show the code in style tags
Sander Berntsen
@sbxn14
Jan 06 2017 01:04
add that @tobylyons to your CSS
Aaron Williams
@atrainbtown
Jan 06 2017 01:04
<div class="container-fluid"><div/>
<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" 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>
Manish Giri
@Manish-Giri
Jan 06 2017 01:04
@atrainbtown container fluid challenge?
tobylyons
@tobylyons
Jan 06 2017 01:05
<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;
}
.silver-background {background color: silver;}
</style>
these are my style tags atm
Manish Giri
@Manish-Giri
Jan 06 2017 01:05

@atrainbtown create a new div, give it the class container-fluid, and put all your html inside it

<div class="container-fluid">
//all html here
</div>

HTML is all code below the closing </style> tag

Aaron Williams
@atrainbtown
Jan 06 2017 01:05
yea
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:05
"Try giving your form, which now has the id attribute of cat-photo-form, a green background."
How?
Aaron Williams
@atrainbtown
Jan 06 2017 01:05
is html all of my code?
Manish Giri
@Manish-Giri
Jan 06 2017 01:06
@tobylyons you're missing the - here - background color
Anh Nguyen
@tiremon112
Jan 06 2017 01:06
@Manish-Giri hey sherlock what exactly do i put in for my submit contact form. My email address ?
Manish Giri
@Manish-Giri
Jan 06 2017 01:06

@atrainbtown

HTML is all code below the closing </style> tag

Anh Nguyen
@tiremon112
Jan 06 2017 01:06
for the portfolio challenge
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:06
<form action="/submit-cat-photo" id="cat-photo-form">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
Anh Nguyen
@tiremon112
Jan 06 2017 01:06
form action=" in side this thing"
tobylyons
@tobylyons
Jan 06 2017 01:06
ah thank you @Manish-Giri
CamperBot
@camperbot
Jan 06 2017 01:06
:star2: 3576 | @manish-giri |http://www.freecodecamp.com/manish-giri
tobylyons sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
Evan Kalvis
@evan17gr
Jan 06 2017 01:06
@Manish-Giri https://codepen.io/evan17gr/pen/qRENOOdo u know why when i press the button it wont generate a new background?
Aaron Williams
@atrainbtown
Jan 06 2017 01:06
ok thanks @Manish-Giri
CamperBot
@camperbot
Jan 06 2017 01:06
:star2: 3577 | @manish-giri |http://www.freecodecamp.com/manish-giri
atrainbtown sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
tobylyons
@tobylyons
Jan 06 2017 01:07
and thanks @sbxn14 :)
CamperBot
@camperbot
Jan 06 2017 01:07
tobylyons sends brownie points to @sbxn14 :sparkles: :thumbsup: :sparkles:
:cookie: 115 | @sbxn14 |http://www.freecodecamp.com/sbxn14
Manish Giri
@Manish-Giri
Jan 06 2017 01:07
@tiremon112 ideally, the thing in the action is the address of the server which will handle the form data when it clicks "Submit". Since you're making a static page now, you can just make it action="#"
@evan17gr one sec
Anh Nguyen
@tiremon112
Jan 06 2017 01:07
alright thank @Manish-Giri
CamperBot
@camperbot
Jan 06 2017 01:07
tiremon112 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3578 | @manish-giri |http://www.freecodecamp.com/manish-giri
Evan Kalvis
@evan17gr
Jan 06 2017 01:08
@Manish-Giri ok ty
CamperBot
@camperbot
Jan 06 2017 01:08
evan17gr sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3579 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jan 06 2017 01:08
@evan17gr your codepen link is broken
404 page not found
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:08
Can someone help me?
Manish Giri
@Manish-Giri
Jan 06 2017 01:08
@evan17gr @atrainbtown welcome
@OnnoKwS post your code
people will help
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:08
<form action="/submit-cat-photo" id="cat-photo-form">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
Grant Charge
@RugbyCharger
Jan 06 2017 01:09
<img .smaller-image { width: 100px; } src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:09
I need to make the background green
Grant Charge
@RugbyCharger
Jan 06 2017 01:09
Where am I going wrong guys? Thanks!
Evan Kalvis
@evan17gr
Jan 06 2017 01:09
@RugbyCharger .smaller-image { width: 100px; } this needs to go inside the style tags
Manish Giri
@Manish-Giri
Jan 06 2017 01:09
@OnnoKwS show the code inside style tags
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:10
<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;
}

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

#cat-photo-element {
background-color: green;
}
</style>
__mifflin__
@cdrainxv
Jan 06 2017 01:10
can
@OnnoKwS: The id is

cat-photo-form

Manish Giri
@Manish-Giri
Jan 06 2017 01:11

@evan17gr is this right?

function randomBackground(){
   var random = Math.floor(Math.random() * backgrounds.length);
    if (rnd == 0) {
            rnd = 1;}
document.getElementById("new-quote").onclick = randomBackground;

}

did you mean to call the function from within itself?

Grant Charge
@RugbyCharger
Jan 06 2017 01:11
Thanks @evan17gr Have put it in there but nothing's working
CamperBot
@camperbot
Jan 06 2017 01:11
rugbycharger sends brownie points to @evan17gr :sparkles: :thumbsup: :sparkles:
:cookie: 385 | @evan17gr |http://www.freecodecamp.com/evan17gr
Evan Kalvis
@evan17gr
Jan 06 2017 01:11
by the way i change dthat
@Manish-Giri
Anh Nguyen
@tiremon112
Jan 06 2017 01:11
Man, our new president tweet everyday lol
Manish Giri
@Manish-Giri
Jan 06 2017 01:11
@OnnoKwS #cat-photo-element { form not element
@tiremon112 orange chimp he is
Evan Kalvis
@evan17gr
Jan 06 2017 01:12
document.getElementById("new-quote").onclick = randomBackground;do this need to be outside the function?
Onno Heemskerk
@OnnoKwS
Jan 06 2017 01:12
Oh LOL
Thanks, stupid me xd
Manish Giri
@Manish-Giri
Jan 06 2017 01:12
@evan17gr kind of yeah
Evan Kalvis
@evan17gr
Jan 06 2017 01:13
its still not working though :(
hello-world
@katecamper
Jan 06 2017 01:13
are the challenges automatically saved? can,t finish today..
__mifflin__
@cdrainxv
Jan 06 2017 01:13
Yes
Manish Giri
@Manish-Giri
Jan 06 2017 01:13
@evan17gr because background is an array, and it has objects inside it, you need to get to the value of the image property, which is the actual background
hello-world
@katecamper
Jan 06 2017 01:13
so I can close all windows and turn off my computer, right?
Manish Giri
@Manish-Giri
Jan 06 2017 01:14
@evan17gr and you need to actually set the background in the DOM, hold on
imma fork your pen and make changes
Evan Kalvis
@evan17gr
Jan 06 2017 01:14
@Manish-Giri wait so doi need to use another method?
Manish Giri
@Manish-Giri
Jan 06 2017 01:15
no not required
Charles Aviles
@Charlezard
Jan 06 2017 01:15
how to creat class: smaller-image under img? anyone?
Evan Kalvis
@evan17gr
Jan 06 2017 01:15
@Manish-Giri so should i set the bakcground to something anyway?
Manish Giri
@Manish-Giri
Jan 06 2017 01:16
hold on
Evan Kalvis
@evan17gr
Jan 06 2017 01:16
@Manish-Giri ok thanks
CamperBot
@camperbot
Jan 06 2017 01:16
evan17gr sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: evan17gr already gave manish-giri points
Grant Charge
@RugbyCharger
Jan 06 2017 01:17
@Charlezard I'm looking to find out too!
Charles Aviles
@Charlezard
Jan 06 2017 01:18
@RugbyCharger should i try <style> right under img? hmm
Grant Charge
@RugbyCharger
Jan 06 2017 01:18
@evan17gr Any suggestions to help @Charlezard and myself create class: smaller-image under img?
Evan Kalvis
@evan17gr
Jan 06 2017 01:19
@RugbyCharger @Charlezard class="classname"
Manish Giri
@Manish-Giri
Jan 06 2017 01:19
fork it
and look at the function
Johnny
@JohnnyBizzel
Jan 06 2017 01:19
@RugbyCharger What have you coded so far?
Manish Giri
@Manish-Giri
Jan 06 2017 01:19
you can delete the console logs @evan17gr
Charles Aviles
@Charlezard
Jan 06 2017 01:20
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "> i have to insert a class to make the image 100px
Evan Kalvis
@evan17gr
Jan 06 2017 01:20
@Manish-Giri oh k
Johnny
@JohnnyBizzel
Jan 06 2017 01:20
@RugbyCharger @Charlezard class="classname"
Evan Kalvis
@evan17gr
Jan 06 2017 01:21
@Manish-Giri thanks a lot
CamperBot
@camperbot
Jan 06 2017 01:21
evan17gr sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: evan17gr already gave manish-giri points
Johnny
@JohnnyBizzel
Jan 06 2017 01:21
@Charlezard You can put this anywhere inside the img tag
Manish Giri
@Manish-Giri
Jan 06 2017 01:21
@evan17gr welcome
Grant Charge
@RugbyCharger
Jan 06 2017 01:21
@JohnnyBizzel <img class=smaller-image src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Charles Aviles
@Charlezard
Jan 06 2017 01:22
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Johnny
@JohnnyBizzel
Jan 06 2017 01:22
@RugbyCharger close - when using HTML use quotes eg class="smaller-image"
Charles Aviles
@Charlezard
Jan 06 2017 01:22
smaller-image { width: 100px; }.. do i need to add <style> and </style>
Johnny
@JohnnyBizzel
Jan 06 2017 01:23
@Charlezard smaller-image { width: 100px; } must be inside a style tag OR in a CSS file (separate file)
Alex Maroa
@Maroa01
Jan 06 2017 01:23

Can anyone show me how i can fix my code to make change my left-well color to red..

$("#target1").css("color", "red");
$("#target1").prop("disabled", true);
$("#target4").remove();
$("#target2").appendTo("#right-well");
$("#target5").clone().appendTo("#left-well");
$("#target1").parent().css("background-color,red");
$("#left-well").parent().css("background-color,red");

Manish Giri
@Manish-Giri
Jan 06 2017 01:24
@Maroa01 missing quotes
Evan Kalvis
@evan17gr
Jan 06 2017 01:24
@Manish-Giri i dont understand what the [0] represents document.getElementsByTagName("body")[0].style.backgroundImage = "url(" + backgrounds[random].image + ")";
Manish Giri
@Manish-Giri
Jan 06 2017 01:24
it should be ("background-color","red");
Johnny
@JohnnyBizzel
Jan 06 2017 01:24
@evan17gr 1st Element of an array
Manish Giri
@Manish-Giri
Jan 06 2017 01:24
@evan17gr so getElementsByTagName gives an array
of the elements matched
Alex Maroa
@Maroa01
Jan 06 2017 01:25
@Manish-Giri quotes where exactly?
Manish Giri
@Manish-Giri
Jan 06 2017 01:25
@Maroa01 :point_up: January 5, 2017 8:24 PM
Grant Charge
@RugbyCharger
Jan 06 2017 01:25
@JohnnyBizzel Thanks so much, success!!
CamperBot
@camperbot
Jan 06 2017 01:25
rugbycharger sends brownie points to @johnnybizzel :sparkles: :thumbsup: :sparkles:
:star2: 1095 | @johnnybizzel |http://www.freecodecamp.com/johnnybizzel
Evan Kalvis
@evan17gr
Jan 06 2017 01:25
@JohnnyBizzel thanks!
CamperBot
@camperbot
Jan 06 2017 01:25
:star2: 1096 | @johnnybizzel |http://www.freecodecamp.com/johnnybizzel
evan17gr sends brownie points to @johnnybizzel :sparkles: :thumbsup: :sparkles:
Manish Giri
@Manish-Giri
Jan 06 2017 01:25
@evan17gr if you had multiple p elements on the page, and you do
getElementsByTagName("p"), you'd get an array of ps
so the [0] is needed
Johnny
@JohnnyBizzel
Jan 06 2017 01:25
@RugbyCharger Hope it makes sense :+1:
Grant Charge
@RugbyCharger
Jan 06 2017 01:26
@Charlezard Like this: <img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
richard Jones
@gocards23
Jan 06 2017 01:26
I am in the bootstrap section. The directions just took a large leap imo. Can anyone help?
Manish Giri
@Manish-Giri
Jan 06 2017 01:26

@Maroa01 also, here

$("#target1").parent().css("background-color,red");
$("#left-well").parent().css("background-color,red");

it should be one of these selectors, not both..check out the instructions..

Evan Kalvis
@evan17gr
Jan 06 2017 01:26
whats the purpose of the + + in here?(" + backgrounds[random].image + ")"; @Manish-Giri
Sander Berntsen
@sbxn14
Jan 06 2017 01:26
is it possible to create a round button with <i class="fa fa-angle-double-down" aria-hidden="true"></i> this as its icon and nothing else in it?
if so.. how?
Grant Charge
@RugbyCharger
Jan 06 2017 01:26
@JohnnyBizzel The light went off when I put the quotes in! ;)
Manish Giri
@Manish-Giri
Jan 06 2017 01:26
@evan17gr it kind of does string concatenation so it reads something like
url(http://....)
Johnny
@JohnnyBizzel
Jan 06 2017 01:27
@RugbyCharger Light blub moment :sparkles:
Robert Bates
@robsimple
Jan 06 2017 01:27
hello.. I wonder why this is incorrect...
<script>
$(document).ready(function("button").addClass("animated bounce");
{


});

</script>
Manish Giri
@Manish-Giri
Jan 06 2017 01:28
@robsimple syntax is wrong.
Evan Kalvis
@evan17gr
Jan 06 2017 01:28
@Manish-Giri Oh so do u need that because u have two sets of ""?
Grant Charge
@RugbyCharger
Jan 06 2017 01:28
@Charlezard And then drop this in between your Style tags: .smaller-image {
width: 100px;
}
Manish Giri
@Manish-Giri
Jan 06 2017 01:28
@robsimple
$(document).ready(function() 
{
("button").addClass("animated bounce");
});
Robert Bates
@robsimple
Jan 06 2017 01:28
ok, thank you @Manish-Giri
CamperBot
@camperbot
Jan 06 2017 01:28
robsimple sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3580 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jan 06 2017 01:30

@evan17gr the syntax requires you to use the url keyword for setting the bg image - http://www.w3schools.com/jsref/prop_style_backgroundimage.asp

and since you're setting the BG image link dynamically, so you don't have a specific link to start with, that's why you use the string concatenation to plug in the image URL here

"url(" + backgrounds[random].image + ")";

if you had a specific link predetermined, you'd just do

"url(http://link.com)"
@robsimple welcome
Evan Kalvis
@evan17gr
Jan 06 2017 01:32
@Manish-Giri ok thanks i appreciate it!
CamperBot
@camperbot
Jan 06 2017 01:32
evan17gr sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: evan17gr already gave manish-giri points
Alex Maroa
@Maroa01
Jan 06 2017 01:32
@Manish-Giri thank you
CamperBot
@camperbot
Jan 06 2017 01:32
maroa01 sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3581 | @manish-giri |http://www.freecodecamp.com/manish-giri
Robert Bates
@robsimple
Jan 06 2017 01:32
@Manish-Giri - Ok I did it that why in the beginning but I just don't understand why it instructed me to add a Bling before ("button") in the instructions.. <!-- $("button").addClass("animated bounce"); --> makes it confusing...
Charles Aviles
@Charlezard
Jan 06 2017 01:33
@RugbyCharger @JohnnyBizzel Thank you!! i did it :)
CamperBot
@camperbot
Jan 06 2017 01:33
charlezard sends brownie points to @rugbycharger and @johnnybizzel :sparkles: :thumbsup: :sparkles:
:cookie: 25 | @rugbycharger |http://www.freecodecamp.com/rugbycharger
:star2: 1098 | @johnnybizzel |http://www.freecodecamp.com/johnnybizzel
richard Jones
@gocards23
Jan 06 2017 01:33
Put the Like, Info and Delete buttons side-by-side by nesting all three of them within one <div class="row"> element, then each of them within a <div class="col-xs-4"> element.
Manish Giri
@Manish-Giri
Jan 06 2017 01:33
@robsimple do you mean the $? that's the requirement for using the jQuery library, the $ makes the button a jQuery object so you can apply jquery methods on it, like addClass
Johnny
@JohnnyBizzel
Jan 06 2017 01:33
@Charlezard :+1:
Manish Giri
@Manish-Giri
Jan 06 2017 01:33
@Maroa01 @evan17gr welcome
Vinicius Miranda da Silva
@vmsilva19
Jan 06 2017 01:33
Hello
richard Jones
@gocards23
Jan 06 2017 01:33
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary">Like</button>
<button class="btn btn-block btn-info">Info</button>
<button class="btn btn-block btn-danger">Delete</button>
</div>
</div>
Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.
Robert Bates
@robsimple
Jan 06 2017 01:34
hmmmm
ok
richard Jones
@gocards23
Jan 06 2017 01:34
any ideas?
Hello911
@Hello911
Jan 06 2017 01:34
how do I make the photo horizontally centered in its own flex box?
Chase
@hmmChase
Jan 06 2017 01:36
is the challenge "Specify How Fonts Should Degrade" bugged?
NoahWithee
@NoahWithee
Jan 06 2017 01:36
how do i give text input in my form the class form-control?
Manish Giri
@Manish-Giri
Jan 06 2017 01:37
@NoahWithee <input type="text" class="....">
@hmmChase not really, why
NoahWithee
@NoahWithee
Jan 06 2017 01:37
thank you
HiS
@hasanals
Jan 06 2017 01:37
hi, I have a question
Manish Giri
@Manish-Giri
Jan 06 2017 01:38
@gocards23 each button should be nested in it's own col-xs-4 div
<div class="col-xs-4">
 <button class="btn btn-block btn-primary">Like</button>
</div>
HiS
@hasanals
Jan 06 2017 01:38
whats better to learn swift code or java ?
Chase
@hmmChase
Jan 06 2017 01:38
@Manish-Giri its asking me to do two contradictory things
HiS
@hasanals
Jan 06 2017 01:38
for a biggener
Manish Giri
@Manish-Giri
Jan 06 2017 01:38
@hmmChase which are?
Chase
@hmmChase
Jan 06 2017 01:39
use the Lobster but comment out the Lobster call
lobster font*
Manish Giri
@Manish-Giri
Jan 06 2017 01:39
it doesn't say that
it says comment out the lobster URL On line 1
HiS
@hasanals
Jan 06 2017 01:39
beginner*
Manish Giri
@Manish-Giri
Jan 06 2017 01:39
so that the font degrades to Monospace
because Lobster isn't available.
Chase
@hmmChase
Jan 06 2017 01:39
Your h2 element should use the font Lobster.
thats the first criterea
the 3rd criterea is "Comment out your call to Google for the Lobster font by putting <!-- in front of it."
Cameroun Thomas
@rounvision
Jan 06 2017 01:40
I'm definitely going to have to study up more on css class=!!
Manish Giri
@Manish-Giri
Jan 06 2017 01:40
@hmmChase it's supposed to be read sequentially, in order.
first, use Lobster.
then, comment out Lobster.
third, now font degrades to Monospace.
matt lopez
@lowpee
Jan 06 2017 01:41
hey guys i need some help with Change Text Inside an Element Using jQuery.. heres my code. I'm done with all tasks except number one which is "emphasize the text in your target4 button by adding html tags
<script>
$(document).ready(function() {
$("#target1").css("color", "red");
$("#target4").html("<em>#target4<em>");
});
</script>
Manish Giri
@Manish-Giri
Jan 06 2017 01:41
@LordLopie missing / in closing </em> tag
matt lopez
@lowpee
Jan 06 2017 01:42
@Manish-Giri I MUST BE TIRED lol time for a break lol thanks
CamperBot
@camperbot
Jan 06 2017 01:42
lordlopie sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 3582 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Jan 06 2017 01:42
@LordLopie welcome
Chase
@hmmChase
Jan 06 2017 01:42
@Manish-Giri i can get your solution please?
Mike Strano
@siver12
Jan 06 2017 01:42
@AIDXNZ Hey AIDXNZ did you get the correct code for the above exercise?
__mifflin__
@cdrainxv
Jan 06 2017 01:42
@Manish-Giri i can get your solution help please?
Manish Giri
@Manish-Giri
Jan 06 2017 01:42
@hmmChase post your code instead, I'll tell you what need to fix.
@cdrainxv can too
coz I gotta jet..
oh well, the main code itself isn't there..
Chase
@hmmChase
Jan 06 2017 01:44

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

Meisha Booker
@Meisha04
Jan 06 2017 01:45
Hello there, I need help placing the h1 id of orange-text. Here is my code:
Manish Giri
@Manish-Giri
Jan 06 2017 01:45

@hmmChase it's not commented the right way

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

the --> should end after type="text/css">

Meisha Booker
@Meisha04
Jan 06 2017 01:45

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

orange-text {

color: orange;

}
</style>

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

__mifflin__
@cdrainxv
Jan 06 2017 01:46
@Meisha04: orange-text is supposed to be an id. Also you only need one h1 element:
<h1 class="…" id="…">Hello World!</h1>
orange-text should not be here: class="pink-text blue-text orange-text" as it it not a class, but an id.
John Esguerra
@wearejohn
Jan 06 2017 01:47

hello, all.. I super new at this and I'm trying to pass this challenge. I don't understand what I am doing wrong here with the font size: <style>
.red-text {
color: red;

p{
  font-size: 16px;
}

}
</style>

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

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

Chase
@hmmChase
Jan 06 2017 01:47
@Manish-Giri yeah its broken, i just did it wrong that one time but even commenting corrently wont let it pass
ty for your help though
Manish Giri
@Manish-Giri
Jan 06 2017 01:48
@hmmChase post your challenge URL here then, click "run tests" first.
__mifflin__
@cdrainxv
Jan 06 2017 01:48

@wearejohn: You currently have this:

p{
  font-size: 16px;
}

inside of the .red-text selector. They should be seperate:

.red-text {
  color: red;
}

p {
  font-size: 16px;
}
Evan Kalvis
@evan17gr
Jan 06 2017 01:49
does anyone know where to find the api for the random quote machine?
Manish Giri
@Manish-Giri
Jan 06 2017 01:49
@wearejohn close the } for red-text first, before beginning { for p.
Manish Giri
@Manish-Giri
Jan 06 2017 01:49
@evan17gr quotesondesign, mashape, etc
Evan Kalvis
@evan17gr
Jan 06 2017 01:49
the one for the random quote not the twitter
@Manish-Giri ok thanks again
CamperBot
@camperbot
Jan 06 2017 01:49
evan17gr sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:warning: evan17gr already gave manish-giri points
Manish Giri
@Manish-Giri
Jan 06 2017 01:49
@hmmChase click "run tests" first
Chase
@hmmChase
Jan 06 2017 01:50
i clicked it a bunch
2 X's 2 check's
Manish Giri
@Manish-Giri
Jan 06 2017 01:50
then post a screenshot
can't do much without your complete URL
Chase
@hmmChase
Jan 06 2017 01:50
im just going to skip it
John Esguerra
@wearejohn
Jan 06 2017 01:52
I also don't understand this whole "Browser and Text zoom should be at 100%"
Ryan
@Azbo400
Jan 06 2017 01:53
@wearejohn That just means it might not pass if you are zoomed in
Sander Berntsen
@sbxn14
Jan 06 2017 01:54
anyone know how I can assign my js for scrolling to the button in the middle of the screen? im a huge newbie when it comes to js and I donno how to do it myself.. http://codepen.io/sbxn14/pen/egmKRr
Travis
@TravisFricker
Jan 06 2017 01:56

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

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

can antonbe give me an idea of where to put the abcbors?
John Esguerra
@wearejohn
Jan 06 2017 01:56
@Azbo400 thank you for clarifying!!
CamperBot
@camperbot
Jan 06 2017 01:56
wearejohn sends brownie points to @azbo400 :sparkles: :thumbsup: :sparkles:
:cookie: 612 | @azbo400 |http://www.freecodecamp.com/azbo400
Travis
@TravisFricker
Jan 06 2017 01:57

Can anyone give me an idea of how to place the anchors so that the image becomes a link?

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

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
Sorry for my bad typing the first time.

AKB47
@AKB47
Jan 06 2017 02:00
How do you use # to make it a dead link?
eeflores
@eeflores
Jan 06 2017 02:00
@TravisFricker <a href="#"><img src="source.jpg"></a>
Travis
@TravisFricker
Jan 06 2017 02:00
@AKB47 you put it in "#"
thanks @eeflores
CamperBot
@camperbot
Jan 06 2017 02:01
travisfricker sends brownie points to @eeflores :sparkles: :thumbsup: :sparkles:
:cookie: 906 | @eeflores |http://www.freecodecamp.com/eeflores
Travis
@TravisFricker
Jan 06 2017 02:03
@AKB47 herf="#"htms
html
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:07
Hey coders! I have my browser's zoom set to 100% and it still won't let me pass this challenge. Any tips? Using Mozilla.
Anthony
@BotBone
Jan 06 2017 02:07
<div class="row"> <div class="col-xs-7"> <input type="text" class="form-control" placeholder="cat photo URL" required></div> <div class="row"> <div class="col-xs-5"><button type="submit" class="btn btn-primary"><i class="fa fa-paper-plane"></i> Submit</button> </form> </div> can anyone tell me why it's giving me an error when i closed out the element with </div>... its saying that Its not closed out...
travis
@tmoats11
Jan 06 2017 02:08
having trouble with this
Emphasize the text in your target4 button by adding HTML tags.
this is what I have so far
$("#target4").html();
not sure what else to add
Anh Nguyen
@tiremon112
Jan 06 2017 02:09
in the () pretty sure
(#target4)
Aya-Majestic
@Aya-Majestic
Jan 06 2017 02:10
having trouble, this CSS Class is set up correctly right?
<style>
  pink-text{
    color: pink;
  }
</style>
Anh Nguyen
@tiremon112
Jan 06 2017 02:10
so html(#target4) and the emphasize element @tmoats11
inside the ()
(<something>#target4<something>)
@Aya-Majestic you forgot .
Cameroun Thomas
@rounvision
Jan 06 2017 02:12
@Aya-Majestic forgot .
Aya-Majestic
@Aya-Majestic
Jan 06 2017 02:12
@tiremon112 Thought so thank you
CamperBot
@camperbot
Jan 06 2017 02:12
:cookie: 127 | @tiremon112 |http://www.freecodecamp.com/tiremon112
aya-majestic sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
Carlos Alfaro
@devbysalas
Jan 06 2017 02:12
Hello guys need some help, here is my code
<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target4").html("<em>jQuery Playground</em>");
  });
</script>
Eric Allen
@allener02
Jan 06 2017 02:12

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

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

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

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

Aya-Majestic
@Aya-Majestic
Jan 06 2017 02:12
@rounvision thank you
CamperBot
@camperbot
Jan 06 2017 02:12
aya-majestic sends brownie points to @rounvision :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for rounvision
Eric Allen
@allener02
Jan 06 2017 02:14
how do i show it like Carlos Alfaro my code?
Anh Nguyen
@tiremon112
Jan 06 2017 02:15
@allener02 it doesn't say add font-size to .red-text class, so you doing it wrong btw =].
coffeebeanzz
@coffeebeanzz
Jan 06 2017 02:15
read the link that pops up below @allener02 '''
CamperBot
@camperbot
Jan 06 2017 02:15
:bulb: to format code use backticks! ``` more info
Anh Nguyen
@tiremon112
Jan 06 2017 02:16
@allener02 this is what it mean add p{} to style element
Carlos Alfaro
@devbysalas
Jan 06 2017 02:17
Eric Allen
@allener02
Jan 06 2017 02:20
Thanks guys this really helps
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:20
eta: I have a green check for the img element class part. It's the browser's zoom issue that's the problem and it's at 100%.
coffeebeanzz
@coffeebeanzz
Jan 06 2017 02:21
meh it's not the ZOOM ZOOM
Anh Nguyen
@tiremon112
Jan 06 2017 02:21
lol
haha
Carlos Alfaro
@devbysalas
Jan 06 2017 02:23

Need help here.

Make sure to select button id="target4" with jQuery.

`

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

Need help here.

Make sure to select button id="target4" with jQuery.

<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("#target4") .html("<em>#target4</em>");
  });
</script>
Anh Nguyen
@tiremon112
Jan 06 2017 02:24
the space
Travis
@TravisFricker
Jan 06 2017 02:24
I am still stuck trying to insert the anchor into an image, anyone have any guidance?
Anh Nguyen
@tiremon112
Jan 06 2017 02:24
try to delete the space
@mixedbysalas try to delete the space at html
Carlos Alfaro
@devbysalas
Jan 06 2017 02:24
Awesome, thank you guys!!!
Claudio Restifo
@Marmiz
Jan 06 2017 02:25
@TravisFricker what's your code looks like?
Are you sure your anchor text (the part you can click) is the same as the requested one?
Carlos Alfaro
@devbysalas
Jan 06 2017 02:25
@tiremon112 Thank you!
CamperBot
@camperbot
Jan 06 2017 02:25
mixedbysalas sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
:cookie: 128 | @tiremon112 |http://www.freecodecamp.com/tiremon112
Anh Nguyen
@tiremon112
Jan 06 2017 02:25
@TravisFricker <a> <img> <a/> that is how you insert anchor to image
i mean </a>
Travis
@TravisFricker
Jan 06 2017 02:26
That is where I am confused. It says to input it in the existing image but it is not a .jpeg @marimiz
Anh Nguyen
@tiremon112
Jan 06 2017 02:27
@TravisFricker
<a href=""> <img> </a> do not change anything in <img>
you put the link in href=" "
Travis
@TravisFricker
Jan 06 2017 02:28
thanks @tiremon112
CamperBot
@camperbot
Jan 06 2017 02:28
travisfricker sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
:cookie: 129 | @tiremon112 |http://www.freecodecamp.com/tiremon112
Claudio Restifo
@Marmiz
Jan 06 2017 02:28

@TravisFricker the nice part of an anchor is that once wrapped around an element it will became "clickable" and will perform the action specified in it.
so:

<a><img /> </a>
<a> <h1></h1></a>
<a><button></a>

you can wrap it around (almost) any element

Travis
@TravisFricker
Jan 06 2017 02:29
thanks a lot
Anh Nguyen
@tiremon112
Jan 06 2017 02:31
:+1:
Alex Maroa
@Maroa01
Jan 06 2017 02:32
Hey guys! I am having trouble starting the front end development projects. Can anyone help me get started in building a tribute page.
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 02:33
Hey ! What does "top of your code editor" means?
I m trying to call "Losbster" font
Anh Nguyen
@tiremon112
Jan 06 2017 02:34
@Maroa01 That work take a lot of time lol
i mean would
Alex Maroa
@Maroa01
Jan 06 2017 02:35
@tiremon112 I know lol... But i cant find the instructions on how to get started on the project. Do you know how to do so?
Anh Nguyen
@tiremon112
Jan 06 2017 02:36
@Maroa01 so thing you need : text-align: center, an img, <ul> <li> for bullet, a white back-ground
Ve Vanderpool
@VanAmoVe
Jan 06 2017 02:36
hey all, for adding images, should I anchor each one or put them all within the smae anchor?
Anh Nguyen
@tiremon112
Jan 06 2017 02:36
@Maroa01 there is no instruction. This part suppose to take everything you know and make it on your own.
Claudio Restifo
@Marmiz
Jan 06 2017 02:37
@VanAmoVe each one it own anchor is the best practice :)
Cameroun Thomas
@rounvision
Jan 06 2017 02:37

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

<style>

Alex Maroa
@Maroa01
Jan 06 2017 02:37
@tiremon112 I had no idea there was no instructions.
Ve Vanderpool
@VanAmoVe
Jan 06 2017 02:37
thanks @Marmiz
CamperBot
@camperbot
Jan 06 2017 02:37
:cookie: 612 | @marmiz |http://www.freecodecamp.com/marmiz
vanamove sends brownie points to @marmiz :sparkles: :thumbsup: :sparkles:
Anh Nguyen
@tiremon112
Jan 06 2017 02:38
@Maroa01 it give you an example page, if you already finished all the tutoring. You could see a vision how it was done.
this is an example page
Alex Maroa
@Maroa01
Jan 06 2017 02:39
@tiremon112 So should i make a similar page to this one?
Anh Nguyen
@tiremon112
Jan 06 2017 02:39
@Maroa01 yes you should
that is the goal
@Maroa01 but with different story
@Maroa01 instead Dr.Norman you could do someone else like Kayne West or Donald trump
Randall Wyatt
@RandallWy
Jan 06 2017 02:40
I need some help with a Java issue I am having. Could anyone lend a hand? The thing I need help on is to conver a string to an int. where a=1 and A=2 || z=26 Z=52 for example.
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:41

@coffeebeanzz Here is my code. I have have the classing in the img element and the green check for it. My width is at 100% and so is my browser. Still no luck .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>

Anh Nguyen
@tiremon112
Jan 06 2017 02:41
@RandallWy this is not place for Java
Randall Wyatt
@RandallWy
Jan 06 2017 02:41
I asked in the java room and no one responded.
Anh Nguyen
@tiremon112
Jan 06 2017 02:41
@RandallWy go to java community, they have more knowledge this is for beginner :smile:
Alex Maroa
@Maroa01
Jan 06 2017 02:41
@tiremon112 Should i follow the same HTML as they one they have provided here?...
Anh Nguyen
@tiremon112
Jan 06 2017 02:43
@Maroa01 you can. If you mean stealing code from inspect element nuuuuu.
@Maroa01 just make a similar one, be creative
Alex Maroa
@Maroa01
Jan 06 2017 02:43
Thank you. @tiremon112
CamperBot
@camperbot
Jan 06 2017 02:43
maroa01 sends brownie points to @tiremon112 :sparkles: :thumbsup: :sparkles:
:cookie: 130 | @tiremon112 |http://www.freecodecamp.com/tiremon112
Anh Nguyen
@tiremon112
Jan 06 2017 02:44
@Maroa01 Gl and have fun with first project :+1:
Claudio Restifo
@Marmiz
Jan 06 2017 02:45

@FunkyCodeMedina there's an extra " here:

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

Try to get rid of it and see if it helps

Margaret
@Margaret2
Jan 06 2017 02:45
@tiremon112 wow still on here :D
gotta rack up those points eh?
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 02:46
@Margaret2 Your img element should have the class smaller-image - I can't do this.
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:47
@Marmiz that didn't work, but thank you!
Margaret
@Margaret2
Jan 06 2017 02:47
@nachiketathakur you need to
  • make a new pair of brackets in style tags: .smaller-image { ... }
  • add smaller-image to your <img> using class=""
18MackeyR
@18MackeyR
Jan 06 2017 02:48
how would I replace a href with a # to make a dead link?
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 02:48
@Margaret2 Thanks ! trying.
CamperBot
@camperbot
Jan 06 2017 02:48
nachiketathakur sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1033 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 02:48
@FunkyCodeMedina show your whole style element pls
@18MackeyR replace the URL (part in quotes) with #
honeylovescode
@honeylovescode
Jan 06 2017 02:48
I am doing something wrong. Only add one class with each of your three selectors . $("button") $(".btn") $("target1") .addClass(animated shake btn-primary);
Travis
@TravisFricker
Jan 06 2017 02:49
this still isn't write. Its the image I think. I have tried to put the anchor everywhere
<a><img class="smaller-image thick-green-border" src="#"https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "<a/>
Claudio Restifo
@Marmiz
Jan 06 2017 02:49
@FunkyCodeMedina probably some other places in your code than.
Show the full code please, and try also to refresh the page :)
lovemuffin
@lovemuffin
Jan 06 2017 02:49
@honeylovescode I having the same issue
Margaret
@Margaret2
Jan 06 2017 02:49
@honeylovescode you will need three lines following this format:
$("selector").addClass("classname");
The instructions tell you which class to add to which selector
button -> animated
.btn -> shake
#target1 -> btn-primary
@honeylovescode @lovemuffin
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:50

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

Margaret
@Margaret2
Jan 06 2017 02:51
@FunkyCodeMedina missing a closing }for youf p style rule
lovemuffin
@lovemuffin
Jan 06 2017 02:51
@Margaret2 here is my code: $("#target1").addClass("btn-primary");
$("button").addClass("animated shake");
$(".btn").addClass("animated");
Margaret
@Margaret2
Jan 06 2017 02:52
@lovemuffin instructions say to:
  • add "animated" to "button"
  • add "shake" to ".btn"
    You need to fix those lines :point_up_2:
18MackeyR
@18MackeyR
Jan 06 2017 02:52
Thanks @Margaret2 . I didnt think to delete the link. lol
CamperBot
@camperbot
Jan 06 2017 02:52
18mackeyr sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1034 | @margaret2 |http://www.freecodecamp.com/margaret2
honeylovescode
@honeylovescode
Jan 06 2017 02:52
@Margaret2 @Margaret2 ok, I am thinking, still not getting it, I have all of it right except this Only add one class with each of your three selectors.
Margaret
@Margaret2
Jan 06 2017 02:52
@lovemuffin you should not be adding "shake" to "button"
@honeylovescode show your code
coffeebeanzz
@coffeebeanzz
Jan 06 2017 02:53
@FunkyCodeMedina now you need space between " and src
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:53
@Margaret2 crap, it got delete during a ctrl x situation lol thanks!
CamperBot
@camperbot
Jan 06 2017 02:53
funkycodemedina sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1035 | @margaret2 |http://www.freecodecamp.com/margaret2
honeylovescode
@honeylovescode
Jan 06 2017 02:53
$(document).ready(function() {
$("button") $(".btn") $("target1").addClass("animated shake btn-primary");
});
</script>
Margaret
@Margaret2
Jan 06 2017 02:53
@honeylovescode read what i said above and do it, you need 3 separate lines
honeylovescode
@honeylovescode
Jan 06 2017 02:54
ok hold on
Margaret
@Margaret2
Jan 06 2017 02:54
@honeylovescode If you don't remember, it's here - :point_up: January 5, 2017 9:49 PM
lovemuffin
@lovemuffin
Jan 06 2017 02:54
@Margaret2
<script>
$(document).ready(function() {
$("#target1").addClass("btn-primary");
$("button").addClass("animated");
$(".btn").addClass("animated shake");
});
</script>
Margaret
@Margaret2
Jan 06 2017 02:55
@lovemuffin should not be adding the class "animated" to ".btn"
lovemuffin
@lovemuffin
Jan 06 2017 02:55
ahh
FunkyCodeMedina
@FunkyCodeMedina
Jan 06 2017 02:55
Hey @coffeebeanzz it worked with out it but I put it in. Thanks!
CamperBot
@camperbot
Jan 06 2017 02:55
funkycodemedina sends brownie points to @coffeebeanzz :sparkles: :thumbsup: :sparkles:
:star2: 1598 | @coffeebeanzz |http://www.freecodecamp.com/coffeebeanzz
Joe Escobedo
@joeEscob1023
Jan 06 2017 02:55
kinda confused on how divs with bootstrap work. Like i see what they do, but in this cat app lesson, it puts the first picture of the cat on the upper right hand side with col-xs-4. how?
how does it know where to go.
lovemuffin
@lovemuffin
Jan 06 2017 02:55
omg mad props @Margaret2
thx
Margaret
@Margaret2
Jan 06 2017 02:56
XD no prob, good job @lovemuffin
@TacoJoe it is based on percentages, all of the columns have to add up to 12 for each row, so col-xs-4 will take up 1/3 of the width since 4 is 1/3 of 12
Ve Vanderpool
@VanAmoVe
Jan 06 2017 02:57
not completely related but can anyone recommend any books that may help through a newbie's coding journey?
Romano Radeta
@Radettacel
Jan 06 2017 02:57

guys i need help !! i just started and took a 20 min break and now I'm stuck or have a brain fart... its asking me to
Inside your style element, change the h2 selector to .red-text and update the color's value from blue to red.

Give your h2 element the class attribute with a value of 'red-text'.

Margaret
@Margaret2
Jan 06 2017 02:58
@Radettacel ok, and what have you tried
Joe Escobedo
@joeEscob1023
Jan 06 2017 02:58
but how does it know to go to the top and say not the bottom?
or the middle?
Anh Nguyen
@tiremon112
Jan 06 2017 02:58
Pick a program language and then google it @VanAmoVe
Margaret
@Margaret2
Jan 06 2017 02:59
@TacoJoe the top to bottom position depends on the order of the elements in your code, so whatever is first in your code will be at the top by default
honeylovescode
@honeylovescode
Jan 06 2017 02:59
I got it thanks @Margaret2
CamperBot
@camperbot
Jan 06 2017 02:59
honeylovescode sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1036 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 02:59
the column classes in Bootstrap only control the left-to-right position
Joe Escobedo
@joeEscob1023
Jan 06 2017 03:00
oh! ok i see now!
Ve Vanderpool
@VanAmoVe
Jan 06 2017 03:00
@Radettacel
Joe Escobedo
@joeEscob1023
Jan 06 2017 03:00
thanks @Margaret2
CamperBot
@camperbot
Jan 06 2017 03:00
tacojoe sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1037 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 03:00
:smile:
Ve Vanderpool
@VanAmoVe
Jan 06 2017 03:00
@Radettacel <style>
.red-text {
color: red;
}
Joe Escobedo
@joeEscob1023
Jan 06 2017 03:00
I think im making bootstrap a little more complicated that it should be xD
Margaret
@Margaret2
Jan 06 2017 03:00
@VanAmoVe do not paste answers please
@TacoJoe haha, well at least you're trying to understand the concept
Ve Vanderpool
@VanAmoVe
Jan 06 2017 03:02
@Margaret2 how do i answer his question then? i have seen others
Anh Nguyen
@tiremon112
Jan 06 2017 03:02
Dont paste the answer margaret. Need this job :smile:
Margaret
@Margaret2
Jan 06 2017 03:02
@VanAmoVe this is a help room, not an answer key. You have to try and explain it so they can figure it out for themselves.
That is how learning happens, not by having someone just give you the answer
Anh Nguyen
@tiremon112
Jan 06 2017 03:03
Exactly :+1:
Im taking a break gl all
Margaret
@Margaret2
Jan 06 2017 03:05
cya @tiremon112 :sparkles:
Ve Vanderpool
@VanAmoVe
Jan 06 2017 03:05
my bad
Margaret
@Margaret2
Jan 06 2017 03:05
no worries :smile:
Ramesh Natesan
@rameshnatesan
Jan 06 2017 03:06
hi
Joshua
@archmod
Jan 06 2017 03:08
how do i install tidy-html5?
ceasar
@chichubling
Jan 06 2017 03:10
can someone help me figure out what a stylesheet is i have re -read all the directions in the challenge and it doesn't say anything about it
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:10
@rounvision thanks
CamperBot
@camperbot
Jan 06 2017 03:10
nachiketathakur sends brownie points to @rounvision :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for rounvision
Margaret
@Margaret2
Jan 06 2017 03:11
@archmod never heard of it before, but just went to their website. Looks pretty easy if you have a Mac, but not so easy otherwise
Romano Radeta
@Radettacel
Jan 06 2017 03:12
thanks @VanAmoVe
CamperBot
@camperbot
Jan 06 2017 03:12
radettacel sends brownie points to @vanamove :sparkles: :thumbsup: :sparkles:
:cookie: 69 | @vanamove |http://www.freecodecamp.com/vanamove
Joshua
@archmod
Jan 06 2017 03:12
do you use atom @Margaret2
Margaret
@Margaret2
Jan 06 2017 03:12
@chichubling "stylesheet" basically means a "style rule". So each set of brackets is considered a style sheet.
@archmod yeah
ceasar
@chichubling
Jan 06 2017 03:14
ok thanks @Margaret2
CamperBot
@camperbot
Jan 06 2017 03:14
chichubling sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1038 | @margaret2 |http://www.freecodecamp.com/margaret2
Joshua
@archmod
Jan 06 2017 03:14
@Margaret2 im using it as well but i keep getting an error Error: spawn tidy ENOENT
Error: spawn tidy ENOENT
at getENOENTError (C:\Users\Josh.atom\packages\linter-tidy\node_modules\sb-exec\lib\helpers.js:159:15)
at ChildProcess.<anonymous> (C:\Users\Josh.atom\packages\linter-tidy\node_modules\sb-exec\lib\index.js:50:46)
at emitTwo (events.js:106:13)
at ChildProcess.emit (events.js:191:7)
at maybeClose (internal/child_process.js:877:16)
at Socket.<anonymous> (internal/child_process.js:334:11)
at emitOne (events.js:96:13)
at Socket.emit (events.js:188:7)
at Pipe._handle.close [as _onclose] (net.js:493:12)
Margaret
@Margaret2
Jan 06 2017 03:14
@archmod maybe you could try https://atom.io/packages/linter-tidy the linter, it's based on tidy...
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:14
@Margaret2 Your img element should have the class thick-green-border - m stuck here
Joshua
@archmod
Jan 06 2017 03:14
@Margaret2 thats what im using but something isnt working with it :/
Romano Radeta
@Radettacel
Jan 06 2017 03:14

@Margaret2

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

<h2>CatPhotoApp</h2>

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

Margaret
@Margaret2
Jan 06 2017 03:14
you need to put the class name thick-green-border inside your class attribute, so class="smaller-image ...."
@Radettacel you need to apply the class to your <h2> element using class="", there should be an example in the instructions
Romano Radeta
@Radettacel
Jan 06 2017 03:15
my h2 element should be red and my h2 element should have the class red-text....
Noah Harness
@Harnessn
Jan 06 2017 03:17
@Radettacel your element should look like this: <h2 style = color: red> text </h2> try that bro
Margaret
@Margaret2
Jan 06 2017 03:18
@archmod maybe you could create an issue on their github repo, they might be willing to help you with it. I don't really know how to fix that
Cameroun Thomas
@rounvision
Jan 06 2017 03:22
Create a class called smaller-image and use it to resize the image so that it's only 100 pixels wide.
Margaret
@Margaret2
Jan 06 2017 03:22
@Harnessn nope, that's not right for this challenge. Read the instructions before trying to help people :smile:
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:22
}
.thick-green-border{
border-color: green;
border-width: 10px;
border-style: solid;
}
Cameroun Thomas
@rounvision
Jan 06 2017 03:22
What am I doing wrong
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:23
}
.thick-green-border{
border-color: green;
border-width: 10px;
border-style: solid;
}
Margaret
@Margaret2
Jan 06 2017 03:23
@rounvision :point_up: January 5, 2017 9:47 PM
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:23
@Margaret2 }
.thick-green-border{
border-color: green;
border-width: 10px;
border-style: solid;
}
Cameroun Thomas
@rounvision
Jan 06 2017 03:23

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

Noah Harness
@Harnessn
Jan 06 2017 03:23
@Margaret2 haha you should read the instructions on not being a jerk. It could help you out in life. Plus that response was accurate on how to change text to color red sooo.....maybe read next time haha
Patrick Tran
@tranpatrick01
Jan 06 2017 03:24
where can i get social icon?
Cameroun Thomas
@rounvision
Jan 06 2017 03:24
Im trying to create a class to make my image smaller
__mifflin__
@cdrainxv
Jan 06 2017 03:24
@rounvision: Click on the link here: :point_up: January 5, 2017 8:23 PM
@tranpatrick01: font-awsome.
Margaret
@Margaret2
Jan 06 2017 03:24
@Harnessn it will not pass the challenge
Noah Harness
@Harnessn
Jan 06 2017 03:25
@Margaret2 hahahahaha still they can use that advice for the future.
Margaret
@Margaret2
Jan 06 2017 03:25
true
__mifflin__
@cdrainxv
Jan 06 2017 03:26
@Harnessn: The challenge didn't ask for the use of inline styling— you read the instructions. :smile:
Margaret
@Margaret2
Jan 06 2017 03:26
ty @cdrainxv
CamperBot
@camperbot
Jan 06 2017 03:26
margaret2 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1959 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Vinicius Miranda da Silva
@vmsilva19
Jan 06 2017 03:26
could anyone help me with this?
Create a script element making sure it is valid and has a closing tag. You should add $(document).ready(function() { to the beginning of your script element.
*Close your $(document).ready(function() { function with });
I insert the code
<script $(document).ready(function() {});>
</script>
but keeps complaining about "Create a script element making sure it is valid and has a closing tag."
Phillip
@psnider22
Jan 06 2017 03:28
This works but system tells me its wrong..
<h3>
<p class="text-primary text-center">

jQuery Playground
</p>
</h3>
__mifflin__
@cdrainxv
Jan 06 2017 03:28
@vmsilva19: You have to close the opening script tag first:
<script>
$….
</script>
Valentin Minchev
@Codegrammar
Jan 06 2017 03:28
It's my first day of learning to code (basic HTML) and I feel like it's gonna take me years to get to the point of being job ready...is this normal? If I'm dedicated and committed is there gonna be a point where I'm like I kinda know what I'm doing?
Nachiketa Thakur
@nachiketathakur
Jan 06 2017 03:29
did finally !
__mifflin__
@cdrainxv
Jan 06 2017 03:29
@psnider22: The classes text-primary and text-center should be for the h3 element. No p element is required at all:
<h3 class="…">text here</h3>
Trenton Heille
@tlheille
Jan 06 2017 03:29
Hey all, quick question here. I’m trying to change the color of my menu button once it’s clicked, but my JavaScript seems ot not be working. It should add the .clicked class to the .siteNavToggleLink element, but it isn’t working. Can anyone troubleshoot what I did wrong? http://codepen.io/tlheille/pen/NdPLJG?editors=0010
Vinicius Miranda da Silva
@vmsilva19
Jan 06 2017 03:29
tks.. it worked @cdrainxv
Margaret
@Margaret2
Jan 06 2017 03:30
@Codegrammar yeah, you will get more confident, once you start building the projects on your own, it will really help you to get used to it.
Phillip
@psnider22
Jan 06 2017 03:30
@cdrainxv thanks!!
CamperBot
@camperbot
Jan 06 2017 03:30
psnider22 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1960 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
honeylovescode
@honeylovescode
Jan 06 2017 03:31
I'm not sure why this is not working: Emphasize the text in your target4 button by adding HTML tags. my code:$("#target4").html("<em>target4</em>);
gstpierre11
@gstpierre11
Jan 06 2017 03:31
Missing a quote
Margaret
@Margaret2
Jan 06 2017 03:32
yep, otherwise it's good
missing quote after </em> @honeylovescode
honeylovescode
@honeylovescode
Jan 06 2017 03:34
@Margaret2 its still not working
__mifflin__
@cdrainxv
Jan 06 2017 03:34

@honeylovescode: You also have the wrong text. Reference the actual button with id of target4:

<button class="btn btn-default target" id="target4">#target4</button>

Margaret
@Margaret2
Jan 06 2017 03:34
oh yeah, missed that :point_up_2: :smile:
honeylovescode
@honeylovescode
Jan 06 2017 03:34
target4
Margaret
@Margaret2
Jan 06 2017 03:34
needs #
Patrick Tran
@tranpatrick01
Jan 06 2017 03:35
honeylovescode
@honeylovescode
Jan 06 2017 03:35
oh :
RslWlsn3
@RslWlsn3
Jan 06 2017 03:35

Each of your Bootstrap buttons should be nested within its own div element with the class col-xs-4.

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

what am i missing?

Patrick Tran
@tranpatrick01
Jan 06 2017 03:35
now how do i upload it to codepen
vigilante0525
@vigilante0525
Jan 06 2017 03:35
Where can I get like a blank html app to practice and do my own codes?
Akinhwan
@akinhwan
Jan 06 2017 03:35
you mean boilerplate?
Valentin Minchev
@Codegrammar
Jan 06 2017 03:35
Thx @Margaret2 for your reply...I feel like I'm asking a lot of stupid questions but since it's my first day it's all kinda vague and unclear...so, is FreeCodeCamp gonna automatically gonna assign those projects to me or do I have to just start working on them when I feel ready?...
CamperBot
@camperbot
Jan 06 2017 03:35
codegrammar sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1039 | @margaret2 |http://www.freecodecamp.com/margaret2
honeylovescode
@honeylovescode
Jan 06 2017 03:36
@tranpatrick01 @cdrainxv @gstpierre11 thank you got it :)
CamperBot
@camperbot
Jan 06 2017 03:36
honeylovescode sends brownie points to @tranpatrick01 and @cdrainxv and @gstpierre11 :sparkles: :thumbsup: :sparkles:
:cookie: 118 | @gstpierre11 |http://www.freecodecamp.com/gstpierre11
:star2: 1961 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
:cookie: 133 | @tranpatrick01 |http://www.freecodecamp.com/tranpatrick01
Margaret
@Margaret2
Jan 06 2017 03:36
@Codegrammar you can look at the map to see the sequence of lessons and projects
@Codegrammar but it's a great idea to work on some of your own outside of FCC too!
__mifflin__
@cdrainxv
Jan 06 2017 03:37
@tlheille: You have this in quotes:
$('.siteNavToggleLink').click(function() {
      $('this').toggleClass('clicked');
    });
rickmastersan
@rickmastersan
Jan 06 2017 03:37
holla
Trenton Heille
@tlheille
Jan 06 2017 03:38
@cdrainxv thanks! It looks like I’m having trouble with the CSS class as well as when I add it into the markup to test it still isn’t changing. I’ll see if I can trouble shoot that
CamperBot
@camperbot
Jan 06 2017 03:38
tlheille sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1962 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Valentin Minchev
@Codegrammar
Jan 06 2017 03:39
Thx @Margaret2 ...gonna check out the map
CamperBot
@camperbot
Jan 06 2017 03:39
codegrammar sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:warning: codegrammar already gave margaret2 points
__mifflin__
@cdrainxv
Jan 06 2017 03:40
@vigilante0525: There's a lot of text editors online… codepen, plunkr, jsfiddle, repl.it … etc.
Damien
@okvitae
Jan 06 2017 03:40
doesn't jquery have an onClick() method?
Margaret
@Margaret2
Jan 06 2017 03:41
@okvitae don't think so, usually i use .on("click", function() {...})
Alex H
@A2HR9
Jan 06 2017 03:41
Can someone explain me what this means:
"Add a div element with the class well inside each of your div elements with the class "col-xs-6"
deathlesscrow
@deathlesscrow
Jan 06 2017 03:41
what did i do wrong
Alex H
@A2HR9
Jan 06 2017 03:42
I don't really get it
deathlesscrow
@deathlesscrow
Jan 06 2017 03:42

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

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

h2 {
font-family: Lobster, Monospace;
}

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

.smaller-image {
width: 100px;
}


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

</style>

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

<img class="smaller-image"class1="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>

what did i do wrong i cant get the green border
Damien
@okvitae
Jan 06 2017 03:42
@Margaret2 huh. I must be miss remembernig. thanks
CamperBot
@camperbot
Jan 06 2017 03:42
okvitae sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1040 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 03:42
@deathlesscrow thick-green-border should go inside the original class attribute: class="smaller-image ..."
__mifflin__
@cdrainxv
Jan 06 2017 03:43
@RslWlsn3: Each button needs to inside its own div element with class col-xs-4. For ex:
<div class="col-xs-4">
  <button class="btn btn-block btn-primary">Like</button>
</div>
Damien
@okvitae
Jan 06 2017 03:43
@A2HR9 you have a div
Nick
@Nickt1231
Jan 06 2017 03:43

<Div class="container-fluid">
<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" 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>

Damien
@okvitae
Jan 06 2017 03:43
with <div class= xs-col-6>
Nick
@Nickt1231
Jan 06 2017 03:43
can someone help where am i supposed to put the div closing tag
Margaret
@Margaret2
Jan 06 2017 03:43
@Nickt1231 on the very last line of your entire code
Nick
@Nickt1231
Jan 06 2017 03:44
@Margaret2 I tried that I thought.... it didnt work??
Mamaslearning
@Mamaslearning
Jan 06 2017 03:45
I am working on Use the bootstrap grid to Put Elements side by side. For just this section I have tried the col-x-4 in several position and event tried <button row="col-xs-4" class="btn btn-primary">Like</button>
<div class="row">

<button class="btn btn-primary col-xs-4">Like</button>
<button class="btn btn-info col-xs-4">Info</button>
<button class="btn btn-danger col-xs-4">Delete</button>
</div>
rickmastersan
@rickmastersan
Jan 06 2017 03:45
lol this is mine
Mamaslearning
@Mamaslearning
Jan 06 2017 03:45
Here is how I have it now and still not working
rickmastersan
@rickmastersan
Jan 06 2017 03:45
oops didnt space out properly
soz
<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
__mifflin__
@cdrainxv
Jan 06 2017 03:46
@Nickt1231: div not Div here:
<Div class="container-fluid">
I also recommend movint it to be above the h2 element.
f4rtard
@f4rtard
Jan 06 2017 03:46
i need to make my h2 element blue but its says i need to remove the style attribute from my h2 element how would i do that and keep it blue ?
Amora Brown
@Amorabrown
Jan 06 2017 03:46
Hello. Question.
Alex H
@A2HR9
Jan 06 2017 03:46
How do I know to which of the div elements I have to nest it. There are many of them
__mifflin__
@cdrainxv
Jan 06 2017 03:47
@f4rtard: Remove the style attribute (style="color: red"). Then reference the example on the left.
Nick
@Nickt1231
Jan 06 2017 03:47
@cdrainxv you're the man thanks brotha
CamperBot
@camperbot
Jan 06 2017 03:47
nickt1231 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1963 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Jan 06 2017 03:47
@Mamaslearning: :point_up: January 5, 2017 8:43 PM
Mamaslearning
@Mamaslearning
Jan 06 2017 03:49
Is that a wait a minute sign?
Manish Giri
@Manish-Giri
Jan 06 2017 03:49
yep
Margaret
@Margaret2
Jan 06 2017 03:49
@Mamaslearning no, it's a point up sign, it's a link to a specific message
__mifflin__
@cdrainxv
Jan 06 2017 03:49
@A2HR9: Add a div element with class well inside each of your col-xs-6 divs:
<div class="col-xs-6">
 // here
</div>
<div class="col-xs-6">
  //here
</div>
rickmastersan
@rickmastersan
Jan 06 2017 03:50
@cdrainxv hey are you a developer??
Margaret
@Margaret2
Jan 06 2017 03:50
@Manish-Giri Did you hear? I'm a jerk :point_up: January 5, 2017 10:23 PM
Manish Giri
@Manish-Giri
Jan 06 2017 03:51
lol
rickmastersan
@rickmastersan
Jan 06 2017 03:51
@Margaret2 would you be able to assist me please?
__mifflin__
@cdrainxv
Jan 06 2017 03:51
Not yet… I'm just a lowly engineer. :cry:
Manish Giri
@Manish-Giri
Jan 06 2017 03:51
at least you were called just a "jerk"
Margaret
@Margaret2
Jan 06 2017 03:51
@rickmastersan maybe, what are you working on
Manish Giri
@Manish-Giri
Jan 06 2017 03:51
earlier today, I was called "lowlife"
rickmastersan
@rickmastersan
Jan 06 2017 03:51
better than being a nutritionist @cdrainxv
Margaret
@Margaret2
Jan 06 2017 03:51
@Manish-Giri O.O
Manish Giri
@Manish-Giri
Jan 06 2017 03:52
"stuck in my dark hole"
etc etc
lol
rickmastersan
@rickmastersan
Jan 06 2017 03:52
@Margaret2 well its only responsive style radio buttons
Margaret
@Margaret2
Jan 06 2017 03:52
@rickmastersan paste your code
that you have tried
rickmastersan
@rickmastersan
Jan 06 2017 03:52
@Margaret2 I reckon I followed it accordingly not sure what i did wrong
<div class="row">
<div class="col-xs-6">
<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i> Info</button>
</div>
<div class="col-xs-6">
<button class="btn btn-block btn-danger"><i class="fa fa-trash"></i> Delete</button>
</div>
</div>
Margaret
@Margaret2
Jan 06 2017 03:53
@rickmastersan working on the wrong buttons, the radio buttons are <input type="radio">
rickmastersan
@rickmastersan
Jan 06 2017 03:53
they're all nested
....
cdrainxv @cdrainxv : I wish I could help, but that's above my pay grade.
rickmastersan
@rickmastersan
Jan 06 2017 03:53
ermagahd
Margaret2 @Margaret2 lol
rickmastersan
@rickmastersan
Jan 06 2017 03:53
@cdrainxv hahahaa
__mifflin__
@cdrainxv
Jan 06 2017 03:53
@rickmastersan: Those aren't radio buttons.
Dylan
@dhcodes
Jan 06 2017 03:54
This message was deleted
rickmastersan
@rickmastersan
Jan 06 2017 03:54
@cdrainxv @Margaret2 ah ok i can work it out from there
thanks guys
__mifflin__
@cdrainxv
Jan 06 2017 03:55
@rickmastersan: These are radio buttons:
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
f4rtard
@f4rtard
Jan 06 2017 03:55

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

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
this is what i did and i only need it to be blue and then im done

kvolkster
@kvolkster
Jan 06 2017 03:55

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

orange-text {

color:orange;

}
</style>

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

cdrainxv @cdrainxv : Oh no! People actually take me seriously… :worried:
kvolkster
@kvolkster
Jan 06 2017 03:56
anyone tell me whats wrong here?
__mifflin__
@cdrainxv
Jan 06 2017 03:56
@kvolkster: Wrong syntax:
<h1 class="…" id="…">Hello World!</h1>
Turbooo457
@Turbooo457
Jan 06 2017 03:56
in HTML where do I put the hash sign to create a dead link ... what is the href attribute?
rickmastersan
@rickmastersan
Jan 06 2017 03:56
ok well im gonna redo all of the lessons ive gone through so far thanks again @Margaret2 and @cdrainxv
CamperBot
@camperbot
Jan 06 2017 03:56
rickmastersan sends brownie points to @margaret2 and @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1041 | @margaret2 |http://www.freecodecamp.com/margaret2
:star2: 1964 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Jan 06 2017 03:57

@Turbooo457:

Replace the value of your a element's href attribute with a #, also known as a hash symbol, to turn it into a dead link.

href is an attribute and its value is "value here"… so together
href="value here"… currently your value is a link (http://www.freecatphotoapp.com) … so replace the link with # which will make it dead… so upon clicking it… it will not redirect you anywhere.

kvolkster
@kvolkster
Jan 06 2017 03:58
@cdrainxv thx mate
CamperBot
@camperbot
Jan 06 2017 03:58
kvolkster sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1965 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Turbooo457
@Turbooo457
Jan 06 2017 03:58
Thanks! @cdrainxv
CamperBot
@camperbot
Jan 06 2017 03:58
turbooo457 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1966 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Manish Giri
@Manish-Giri
Jan 06 2017 03:59
:point_up: January 5, 2017 3:19 PM
@Margaret2 the fun begins here :point_up:
ceasar
@chichubling
Jan 06 2017 03:59
how are you guys sending your screens without sending the link itself
__mifflin__
@cdrainxv
Jan 06 2017 04:00
@chichubling: Magic — join the gathering.
Margaret
@Margaret2
Jan 06 2017 04:01
@Manish-Giri well, that was a little mean to not tell him for so long, but he definitely overreacted 0.o
CoryCMyers
@CoryCMyers
Jan 06 2017 04:02
Anyone in here willing to take a quick skim over my Tribute Page before i submit it, and maybe give some tweaks?
__mifflin__
@cdrainxv
Jan 06 2017 04:02
@chichubling: Click on more info below:
'''
CamperBot
@camperbot
Jan 06 2017 04:02
:bulb: to format code use backticks! ``` more info
Margaret
@Margaret2
Jan 06 2017 04:02
@CoryCMyers sure, paste the link
Manish Giri
@Manish-Giri
Jan 06 2017 04:02
O.o
Margaret
@Margaret2
Jan 06 2017 04:02
o.-
Manish Giri
@Manish-Giri
Jan 06 2017 04:02
I would have, had he not started it
CoryCMyers
@CoryCMyers
Jan 06 2017 04:02
@Margaret2 Thank you.
CamperBot
@camperbot
Jan 06 2017 04:02
corycmyers sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1042 | @margaret2 |http://www.freecodecamp.com/margaret2
CoryCMyers
@CoryCMyers
Jan 06 2017 04:03
I was trying to figure out how to make the central picture change to a picture for each of the main characters from the sub series, but it is a bit pact me at this point.
Margaret
@Margaret2
Jan 06 2017 04:03
@CoryCMyers pretty sure there has to be an image
Charles Williams
@cfunkles
Jan 06 2017 04:03
having trouble on creating set of radio button's. Every thing seems fine, not sure why it wont pass.
CoryCMyers
@CoryCMyers
Jan 06 2017 04:03
There is one
Margaret
@Margaret2
Jan 06 2017 04:03
oh i see it lol
Gustave Nishimirwe
@gustavebn
Jan 06 2017 04:04
so i'm confused to how I do the padding-left. it is not reading the commend.
Margaret
@Margaret2
Jan 06 2017 04:04
@CoryCMyers good job! looks like it took a lot of work, i would just fix the spelling of The Infinitely Quoteable
__mifflin__
@cdrainxv
Jan 06 2017 04:05
@gustavebn: Could you show some code?
Manish Giri
@Manish-Giri
Jan 06 2017 04:05
anyone here use chrome canary?
Charles Williams
@cfunkles
Jan 06 2017 04:05
<lable><input type="radio" name="indoor-outdoor"> indoor
</lable>
<lable><input type="radio" name="indoor-outdoor"> outdoor
</lable>
only passing the two radio button elements
Margaret
@Margaret2
Jan 06 2017 04:05
@cfunkles label <- fix the spelling
Charles Williams
@cfunkles
Jan 06 2017 04:06
gosh dang it
CoryCMyers
@CoryCMyers
Jan 06 2017 04:06
@Margaret2 How would you spell it? I have been running on coffee for the last twelveish hours so my speller is plum broke.
Charles Williams
@cfunkles
Jan 06 2017 04:06
I knew it would be dumb
Margaret
@Margaret2
Jan 06 2017 04:06
like i just did for you lol @CoryCMyers
Turbooo457
@Turbooo457
Jan 06 2017 04:06
I'm supposed to create a dead link in HTML, but it keeps telling me it's wrong... <p>Click here for <a href="#">cat photos</a>.</p>
Margaret
@Margaret2
Jan 06 2017 04:06
@Turbooo457 refresh the page
Charles Williams
@cfunkles
Jan 06 2017 04:06
@Margaret2 thank you lots!
CamperBot
@camperbot
Jan 06 2017 04:06
cfunkles sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1043 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 04:07
no prob :smile:
honeylovescode
@honeylovescode
Jan 06 2017 04:07
stuck again $("#target1").parent("#left-well").css("background-color", "red");
Turbooo457
@Turbooo457
Jan 06 2017 04:07
thanks
Manish Giri
@Manish-Giri
Jan 06 2017 04:07
@honeylovescode .parent() doesn't need arguments inside it
it knows what the parent of your selector is
CoryCMyers
@CoryCMyers
Jan 06 2017 04:08
@Margaret2 Do ya think it would be worth it to keep banging away unti l Ican get some fade/dissolve going to swap the central picture for a picture of the character from the books on hover for their link? Or best to just make a note of that, and come back to twaek it later?
Margaret
@Margaret2
Jan 06 2017 04:08
yeah, there would be no point using it if you had to specify the parent
honeylovescode
@honeylovescode
Jan 06 2017 04:08
oh, so I always leave it blank
CoryCMyers
@CoryCMyers
Jan 06 2017 04:08
I just want to be sure everything i put together, could be used as a positive example of ability.
Gustave Nishimirwe
@gustavebn
Jan 06 2017 04:08
what am I doing wrong here? .green-box {
background-color: green;
padding-top: 40px
padding-left: 40px
padding-right: 40px
padding-bottom: 40px
__mifflin__
@cdrainxv
Jan 06 2017 04:09
@Manish-Giri: Why? It's literally bleeding. Chrome canary is a browser that suffers from hemophilia.
Margaret
@Margaret2
Jan 06 2017 04:09
@CoryCMyers idk, you are the only one who can know when you're satisfied - i did the bare minimum for all these projects lol :joy:
__mifflin__
@cdrainxv
Jan 06 2017 04:09
@gustavebn: Missing ; at the ends:
padding-top: 40px; etx
Manish Giri
@Manish-Giri
Jan 06 2017 04:10
lol
RocketMan420
@RocketMan420
Jan 06 2017 04:10
Add a div element with the class well inside each of your div elements with the class "col-xs-6"
I guess I am not doing it right?
Margaret
@Margaret2
Jan 06 2017 04:11
anybody is bored and wanna look at my pointless pen?
http://codepen.io/23_jumi/full/VPYRWm/
Gustave Nishimirwe
@gustavebn
Jan 06 2017 04:11
mmmhh interesting. I did not put that at the top of my first commend but it accepted it. I will try that. thanks @cdrainxv
CamperBot
@camperbot
Jan 06 2017 04:11
gustavebn sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1967 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
__mifflin__
@cdrainxv
Jan 06 2017 04:11
@RocketMan420: :point_up: January 5, 2017 8:49 PM
deathlesscrow
@deathlesscrow
Jan 06 2017 04:11

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

<a herf=http://freecatphotoapp.com> cat photos </a>

Margaret
@Margaret2
Jan 06 2017 04:12
@deathlesscrow href, not herf
and quotes are needed around the URL
__mifflin__
@cdrainxv
Jan 06 2017 04:12
@deathlesscrow:
  • href not herf
  • href="…"
deathlesscrow
@deathlesscrow
Jan 06 2017 04:12
ohhhh im slow lol thanks
__mifflin__
@cdrainxv
Jan 06 2017 04:13

@Margaret2:

ohhhh im slow lol thanks

Same goes for me. :smile:

CamperBot
@camperbot
Jan 06 2017 04:13
cdrainxv sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:star2: 1044 | @margaret2 |http://www.freecodecamp.com/margaret2
Margaret
@Margaret2
Jan 06 2017 04:14
haha, well it won't matter how slow you are now because i'm going to bed :D nite :wave:
RocketMan420
@RocketMan420
Jan 06 2017 04:14
@cdrainxv Thank you ! I was trying to start the <div class before the col-xs-6 class
CamperBot
@camperbot
Jan 06 2017 04:14
rocketman420 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1968 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
Margaret
@Margaret2
Jan 06 2017 04:15
@cdrainxv make 'em wait for those helps, yo
__mifflin__
@cdrainxv
Jan 06 2017 04:15
@Margaret2: Bye!
I read minds.
Patrick Tran
@tranpatrick01
Jan 06 2017 04:15
im trying to do a fade in on my project but im unable to
doing a fade in for my welcome
Adrin Prasad
@GeneralDumbo
Jan 06 2017 04:20
$(document).ready(function() {
is used to prevent javascript codes from running before the html right?
RocketMan420
@RocketMan420
Jan 06 2017 04:20
How can I add a H4 element to a line <div class="col-xs-6">
wher ewould it go
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:20
How would you guys practice Java
?
Manish Giri
@Manish-Giri
Jan 06 2017 04:20
by writing Java
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:21
not javascript
yes
Manish Giri
@Manish-Giri
Jan 06 2017 04:21
I just solve coding challenges in Java
jaghvi
@mehtajaghvi
Jan 06 2017 04:21
@RocketMan420 <div class="col-xs-6"><h4>blah </h4></div>
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:21
but like a challenge
where you get the challenges from?
RocketMan420
@RocketMan420
Jan 06 2017 04:21
@mehtajaghvi thank ya :)
CamperBot
@camperbot
Jan 06 2017 04:21
:cookie: 121 | @mehtajaghvi |http://www.freecodecamp.com/mehtajaghvi
rocketman420 sends brownie points to @mehtajaghvi :sparkles: :thumbsup: :sparkles:
Manish Giri
@Manish-Giri
Jan 06 2017 04:21
lots of sites available
codewars
etc etc
jaghvi
@mehtajaghvi
Jan 06 2017 04:21
@KevonTooPro try project euler, love it
Manish Giri
@Manish-Giri
Jan 06 2017 04:22
google "java code challenges"
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:22
@mehtajaghvi @Manish-Giri thanks
CamperBot
@camperbot
Jan 06 2017 04:22
kevontoopro sends brownie points to @mehtajaghvi and @manish-giri :sparkles: :thumbsup: :sparkles:
:cookie: 122 | @mehtajaghvi |http://www.freecodecamp.com/mehtajaghvi
:star2: 3586 | @manish-giri |http://www.freecodecamp.com/manish-giri
__mifflin__
@cdrainxv
Jan 06 2017 04:22
@tranpatrick01:
$(function() {
  $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
  $(".welcome__text").hide();
  $(".welcome__text").fadeIn(3000);
});
Patrick Tran
@tranpatrick01
Jan 06 2017 04:23
@cdrainxv thanks
CamperBot
@camperbot
Jan 06 2017 04:23
tranpatrick01 sends brownie points to @cdrainxv :sparkles: :thumbsup: :sparkles:
:star2: 1969 | @cdrainxv |http://www.freecodecamp.com/cdrainxv
honeylovescode
@honeylovescode
Jan 06 2017 04:23
the second element is 3 right
$("#target:nth-child(3)").addClass("animated bounce");
Manish Giri
@Manish-Giri
Jan 06 2017 04:23
@honeylovescode 2
not 3
deathlesscrow
@deathlesscrow
Jan 06 2017 04:23
<a href='http://freecatphotoapp.com'> catphotos</a>
Manish Giri
@Manish-Giri
Jan 06 2017 04:24
@honeylovescode also, isn't target a class?
__mifflin__
@cdrainxv
Jan 06 2017 04:24
@deathlesscrow: cat photos
honeylovescode
@honeylovescode
Jan 06 2017 04:24
I have it as a id
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:25
@mehtajaghvi I don’t really understand project euler
__mifflin__
@cdrainxv
Jan 06 2017 04:25
@honeylovescode: target is a class. target3 is an id.
jaghvi
@mehtajaghvi
Jan 06 2017 04:25
@Manish-Giri yes I think
target is a calls @honeylovescode
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:25
its asking me like a math question
honeylovescode
@honeylovescode
Jan 06 2017 04:25
@Manish-Giri ok, I have it as a id, why would I use a . instead of #
Manish Giri
@Manish-Giri
Jan 06 2017 04:25
@KevonTooPro math is inherent to coding, isn't it?
Montgomery Nugen
@MontgomeryNugen
Jan 06 2017 04:25
Hello World!!!
CamperBot
@camperbot
Jan 06 2017 04:25

welcome to FreeCodeCamp @MontgomeryNugen!

Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:26
yes, but the way it is asking me
deathlesscrow
@deathlesscrow
Jan 06 2017 04:26
it still says I need an a element that links to http://freecatphotoapp.com
Manish Giri
@Manish-Giri
Jan 06 2017 04:26
@honeylovescode well, two other people here also say target is a class, so, doesn't hurt to check again..
jaghvi
@mehtajaghvi
Jan 06 2017 04:26
@KevonTooPro you can do those math challenges in any coding language you wont
honeylovescode
@honeylovescode
Jan 06 2017 04:26
its right it is a class, but I don't understand why,
jaghvi
@mehtajaghvi
Jan 06 2017 04:26
@KevonTooPro i am learning python that way, and it is helpful and FUNNNN
Manish Giri
@Manish-Giri
Jan 06 2017 04:26
ah python's syntax annoys me
@honeylovescode what don't you understand?
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:27
yeah I am learning java, I am on an intermediate level with it but the first question is weird
honeylovescode
@honeylovescode
Jan 06 2017 04:27
I have target as a id #target so why is it a class .target
cdrainxv @cdrainxv : Oh no… it's getting late...
Manish Giri
@Manish-Giri
Jan 06 2017 04:28
@KevonTooPro "multiples of 3 and 5"?
Kevon Cambridge
@KevonTooPro
Jan 06 2017 04:28
yeah
I think I got it I was thinking about it differently
__mifflin__
@cdrainxv
Jan 06 2017 04:28
Come on…. simple fizz buzz… :worried:
Manish Giri
@Manish-Giri
Jan 06 2017 04:29
fizz, buzz, fizzbuzz
@honeylovescode why do you have target as id when it is a class?
honeylovescode
@honeylovescode
Jan 06 2017 04:30
@Manish-Giri you killing me smalls lol, the code told me to put it as a id.
Manish Giri
@Manish-Giri
Jan 06 2017 04:30
@honeylovescode what's the challenge name
honeylovescode
@honeylovescode
Jan 06 2017 04:31
@Manish-Giri Target a Specific Child of an Element Using jQuery
deathlesscrow
@deathlesscrow
Jan 06 2017 04:31
<a href="http://freecatphotoapp.com"> cat photos</a> it says a element to link to http://freecatphotoapp.com"
Manish Giri
@Manish-Giri
Jan 06 2017 04:32

@honeylovescode

Make the second child in each of your well elements bounce. You must target the children of element with the target class.

Here's how you would give the third element in each well the bounce class:
$(".target:nth-child(3)").addClass("animated bounce");
Asma Naz
@Anaz100
Jan 06 2017 04:32
NEED HELP ON THIS PART "Use an ID Attribute to Style an Element"
Manish Giri
@Manish-Giri
Jan 06 2017 04:32
target:nth-child(n) css selector allows you to select all the nth elements with the target class or element type
Asma Naz
@Anaz100
Jan 06 2017 04:32
stuck here
RocketMan420
@RocketMan420
Jan 06 2017 04:32
Where do I put the $("button").addClass("animated bounce");
Manish Giri
@Manish-Giri
Jan 06 2017 04:33
where exactly does it say that target is the ID
@RocketMan420 inside the function() {...}
RocketMan420
@RocketMan420
Jan 06 2017 04:33
I tried that
didn't work
Manish Giri
@Manish-Giri
Jan 06 2017 04:33
show code then
__mifflin__
@cdrainxv
Jan 06 2017 04:33
@RocketMan420:
<script>
 $(document).ready(function() {
  // code goes here
 });
</script>
Manish Giri
@Manish-Giri
Jan 06 2017 04:33
@Anaz100 what's the problem?
honeylovescode
@honeylovescode
Jan 06 2017 04:33
@Manish-Girl, ok, I got thank you for your patience :)
CamperBot
@camperbot
Jan 06 2017 04:33
honeylovescode sends brownie points to @manish-girl :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for manish-girl
Manish Giri
@Manish-Giri
Jan 06 2017 04:34
cool
honeylovescode
@honeylovescode
Jan 06 2017 04:34
it
__mifflin__
@cdrainxv
Jan 06 2017 04:34
lol
RocketMan420
@RocketMan420
Jan 06 2017 04:34
Thank you !!
Aysenur Erdem
@aysenurerdem
Jan 06 2017 04:34

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

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

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
}

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


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

<div class="container-fluid">
<h2 class="text-center text-primary">CatPhotoApp</h2>
<a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
<img src="http://bit.ly/fcc-running-cats" class="img-responsive">
<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary">Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info">Info</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-danger">Delete</button>
</div>
</div>
<p>Things cats 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> Nest your first image and your h2 element within a single <div class="row"> element. Nest your h2 element within a <div class="col-xs-8"> and your image in a <div class="col-xs-4"> so that they are on the same line.

Notice how the image is now just the right size to fit along the text?

Could you help me with this question ?
Manish Giri
@Manish-Giri
Jan 06 2017 04:35
girl again
well damn
@aysenurerdem what's the problem?
deathlesscrow
@deathlesscrow
Jan 06 2017 04:36
what am i doing wrong <a href="http://freecatphotoapp.com"> cat photos</a>
__mifflin__
@cdrainxv
Jan 06 2017 04:37
@aysenurerdem: You mixed the classes up.
This should still have smaller-image class. Remove img-responsive.
<a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
Asma Naz
@Anaz100
Jan 06 2017 04:37
@Manish-Giri I dont know to make the background green
Aysenur Erdem
@aysenurerdem
Jan 06 2017 04:37
@Manish-Giri i don't i am confused
Asma Naz
@Anaz100
Jan 06 2017 04:38

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

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

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

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

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

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

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

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

Manish Giri
@Manish-Giri
Jan 06 2017 04:38
@Anaz100 they've given an example on the left with #cat-photo-element, to set the background color to green, it's quite like that. Follow that.
__mifflin__
@cdrainxv
Jan 06 2017 04:38
@Anaz100: The id is

cat-photo-form