These are chat archives for FreeCodeCamp/Help

16th
Aug 2016
Norvin Burrus
@ndburrus
Aug 16 2016 00:00
@Ferngari95 can you post? (if not resolved)
Milan Sharma
@milanksharma
Aug 16 2016 00:04

I am not sure what is wrong with this code for the kitten image
<img src = https://bit.ly/fcc-relaxing-cat

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

Margaret
@Margaret2
Aug 16 2016 00:04
hi, remove the ending </img> tag and just put > after the link
@milanksharma
Boris
@Boris1011
Aug 16 2016 00:05
@milanksharma you don't need a closing img tag, and you'll need a > and " "
<img src="link">
Norvin Burrus
@ndburrus
Aug 16 2016 00:05
@milanksharma :sparkles:
  • here: <img src = https://bit.ly/fcc-relaxing-cat, is there a closing >?
  • remove this </img> (self-closing)
  • also "'s mentioned above
Milan Sharma
@milanksharma
Aug 16 2016 00:09
@ndburrus @Margaret2 How about this?
<img src = https://bit.ly/fcc-relaxing-cat>
Norvin Burrus
@ndburrus
Aug 16 2016 00:09
@milanksharma which lesson is this?
(quotation marks?)
Margaret
@Margaret2
Aug 16 2016 00:09
link needs to be in quotes, no spaces between =
Santiago Gómez
@Sperkajugglite
Aug 16 2016 00:10
@ndburrus thanks man :)
CamperBot
@camperbot
Aug 16 2016 00:10
sperkajugglite sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1605 | @ndburrus |http://www.freecodecamp.com/ndburrus
Milan Sharma
@milanksharma
Aug 16 2016 00:10
@ndburrus Add Images to your website
Norvin Burrus
@ndburrus
Aug 16 2016 00:10
@Sperkajugglite You're welcome! excellent job! :palm_tree:
@milanksharma ok, we need to follow the feedback so far... also, can you post your code?
Milan Sharma
@milanksharma
Aug 16 2016 00:12
@Margaret2 @ndburrus How about this?
<img src="https://bit.ly/fcc-relaxing-cat">
Margaret
@Margaret2
Aug 16 2016 00:12
looks great
Norvin Burrus
@ndburrus
Aug 16 2016 00:12
@milanksharma :+1:
Boris
@Boris1011
Aug 16 2016 00:12
yep that's it!!!
Milan Sharma
@milanksharma
Aug 16 2016 00:14
@ndburrus @Margaret2 Thanks! I really appreciate all the help! Just started this program today!
CamperBot
@camperbot
Aug 16 2016 00:14
milanksharma sends brownie points to @ndburrus and @margaret2 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for margaret2
:star2: 1606 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Aug 16 2016 00:14
@milanksharma you're welcome! excellent job! code passed?
congrats on getting started! :palm_tree:
Milan Sharma
@milanksharma
Aug 16 2016 00:18

@ndburrus @Margaret2 Still not passing... This is the whole program, do you see any errors?

<img src="https://www.your-image-source.com/your-image.jpg" alt="Author standing on a beach with two thumbs up. ">

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

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

h2 {
font-family: Lobster, Monospace;
}

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

<h2 class="red-text">CatPhotoApp</h2>
<img src="https://bit.ly/fcc-relaxing-cat">

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

Popovic Balsa
@balsa823
Aug 16 2016 00:19
no head or body tags?
Norvin Burrus
@ndburrus
Aug 16 2016 00:19
@milanksharma remove the img tag - 1st code line, here:
<img src="https://www.your-image-source.com/your-image.jpg" alt="Author standing on a beach with two thumbs up. ">
Margaret
@Margaret2
Aug 16 2016 00:20
@milanksharma instructions say your img must have an alt attribute
which will be alt="" inside the image tag
Milan Sharma
@milanksharma
Aug 16 2016 00:21
@ndburrus Passed! Thank you so much :smile:
CamperBot
@camperbot
Aug 16 2016 00:21
milanksharma sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:warning: milanksharma already gave ndburrus points
Milan Sharma
@milanksharma
Aug 16 2016 00:21
@Margaret2 Thank you!
CamperBot
@camperbot
Aug 16 2016 00:21
milanksharma sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for margaret2
Norvin Burrus
@ndburrus
Aug 16 2016 00:22
@milanksharma excellent! anytime! :+1:
Margaret
@Margaret2
Aug 16 2016 00:22
👍
Luna
@Lunababe1995
Aug 16 2016 00:24
创建段落,结束语是</P>吗?
为什么不正确呢
coffeebeanzz
@coffeebeanzz
Aug 16 2016 00:24
@balsa823 they are built in. They will also be built in if you use codepen for your projects
pchelpme
@pchelpme
Aug 16 2016 00:26
Hi need help
<p>
View<a href = "#"> more</a>
</p>
Your a element should be nested within your new p element.
whyyy?
that is correct no?
Boris
@Boris1011
Aug 16 2016 00:27
@pchelpme what is the challenge name???
pchelpme
@pchelpme
Aug 16 2016 00:28
Nest an Anchor Element within a Paragraph
i think so
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 00:28
@pchelpme try without spacing <p><a href="">..</a></p>
NelsonRith
@NelsonRith
Aug 16 2016 00:28

Does anyone see anything wrong with this code?
Instructions:

Create a second p element after the existing p element with the following kitty ipsum text: Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

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

<style>
.red-text {
color: red;
font-size: 30px;
}
</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>

pchelpme
@pchelpme
Aug 16 2016 00:28
ok, tahnkx guyz
Mariano
@d1bu
Aug 16 2016 00:29
@NelsonRith your font-size is 30, change ir to 30
16
change it to 16
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:29
@pchelpme
<p>View more <a href="http://www.freecatphotoapp.com">cat photos</a></p>
NelsonRith
@NelsonRith
Aug 16 2016 00:30
I have it set at 16 and it's still not correct

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

Boris
@Boris1011
Aug 16 2016 00:30
@NelsonRith I think when it says in the same style tag as the red-text class, it should be more like
<style>
.red-text {
color:red;
}
p {
font-size:16px;
}
</style>
Margaret
@Margaret2
Aug 16 2016 00:30
@d1bu that's not the problem @nelsonrith Create a new p class with a font size of 16 px
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:31
@NelsonRith because p1 is not a thing
change it to be p
Margaret
@Margaret2
Aug 16 2016 00:31
what he said
Mariano
@d1bu
Aug 16 2016 00:31
oh lol sorry
NelsonRith
@NelsonRith
Aug 16 2016 00:33

Like so?

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

Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:33
@NelsonRith and you're .red-text needs a closing bracket
Boris
@Boris1011
Aug 16 2016 00:33
@NelsonRith ^
NelsonRith
@NelsonRith
Aug 16 2016 00:33
Oh there we go!
haha thanks
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:33
np
pchelpme
@pchelpme
Aug 16 2016 00:39
Hi again
Add a Submit Button to a Form
<form action="/submit-cat-photo">
<input type="text" placeholder="cat photo URL">
<input value="Submit" type = "submit" />
</form>
Your form should have a button inside it.
Your submit button should have the attribute type set to submit.
Your submit button should only have the text "Submit".
Make sure your button element has a closing tag.
they say its all wrong
but its all gud
Margaret
@Margaret2
Aug 16 2016 00:41
@pchelpme you need to have a button element instead of an input element. And take out the value attribute
pchelpme
@pchelpme
Aug 16 2016 00:42
how do you make an element?
Margaret
@Margaret2
Aug 16 2016 00:42
@pchelpme <button></button>
pchelpme
@pchelpme
Aug 16 2016 00:42
i got it
thankx
Margaret
@Margaret2
Aug 16 2016 00:42
:D
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:43
Eldon55
@Eldon55
Aug 16 2016 00:43
Yoo i need help form a professional
Wesley Schulte
@WesSchulte
Aug 16 2016 00:44
hello coder bros and bro-ettes? im struggling with the font size shenanigans. any help would be appreciated!!!
Margaret
@Margaret2
Aug 16 2016 00:44
@Eldon55 what challenge are you on
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:44
@WesSchulte code and what challenge?
Eldon55
@Eldon55
Aug 16 2016 00:44
@Margaret2 im not in a challenge im trying to do a project
Wesley Schulte
@WesSchulte
Aug 16 2016 00:44
between the style tags, give the p elements font size of 16px
everything else for the challenge is completed except that one task
Eldon55
@Eldon55
Aug 16 2016 00:45
@WesSchulte p {
font-size: 16px;
}
Wesley Schulte
@WesSchulte
Aug 16 2016 00:46
do i put that between the two different p?
or one for each paragraph
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:46
@WesSchulte
<style>
p {
font-size: 16px;
}
</style>
Eldon55
@Eldon55
Aug 16 2016 00:47
@WesSchulte no between the style tags
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:47
the means your paragraphs with be font size 16
cvelazquez1215
@cvelazquez1215
Aug 16 2016 00:47
on the challenge"Add image to your website" how do you add an alribute ?
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:47
@WesSchulte you can do it on each line, but thats not what the challenge is asking you to do
Margaret
@Margaret2
Aug 16 2016 00:50
@cvelazquez1215 inside the <img> tag, you will put src="link" and alt=""
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:50
^
Norvin Burrus
@ndburrus
Aug 16 2016 00:50
@cvelazquez1215 :sparkles:
the lesson is describing the purpose of the alt attribute: The text inside an alt attribute is used for screen readers to improve accessibility and is displayed if the image fails to load.
Wesley Schulte
@WesSchulte
Aug 16 2016 00:50
@Stormin-Norman i got it to work for the second paragraph but i dont know where to put in with the first one since I have that one in red
Margaret
@Margaret2
Aug 16 2016 00:50
oh and the link should be in quotes @cvelazquez1215
cvelazquez1215
@cvelazquez1215
Aug 16 2016 00:50
i tried that but it does not pass
Norvin Burrus
@ndburrus
Aug 16 2016 00:51
@cvelazquez1215 can you post?
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:52
@WesSchulte can you post your code, I think i have a idea of what your talking about, and I am afraid I might have confused you.
Wesley Schulte
@WesSchulte
Aug 16 2016 00:52

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

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

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

Norvin Burrus
@ndburrus
Aug 16 2016 00:53
@WesSchulte :sparkles:
we only need one set of style tag/s
cvelazquez1215
@cvelazquez1215
Aug 16 2016 00:53

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

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

Norvin Burrus
@ndburrus
Aug 16 2016 00:54
@cvelazquez1215 :sparkles:
  • the 1st code line should be the link
  • the img tag/s should go between the h2 & p element/s
Margaret
@Margaret2
Aug 16 2016 00:54
@cvelazquez1215 the img should be below the style tags, and you must have an alt attribute within the <img> tag
Boris
@Boris1011
Aug 16 2016 00:54
@WesSchulte
<style>
p {
font-size: 16px;
}
</style>
<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>
Wesley Schulte
@WesSchulte
Aug 16 2016 00:55
if there was any way to vote, you guys would be the real MVP @Boris1011 @ndburrus
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:55
@WesSchulte you only need one set of style tags, you should have a set, where the red-text class is defined.
Norvin Burrus
@ndburrus
Aug 16 2016 00:55
@WesSchulte :+1:
Wesley Schulte
@WesSchulte
Aug 16 2016 00:55
you too @Stormin-Norman!! you guys rock
Boris
@Boris1011
Aug 16 2016 00:56
thanks mate!!!! :smile: I'm still a total noob at this though!?
Roman Ferrante
@Stormin-Norman
Aug 16 2016 00:56
^
a lot of these questions are about the stuff i just did, so I feel like if I can explain what I learned and help others I have master the knowledge (somewhat ;p )
NelsonRith
@NelsonRith
Aug 16 2016 00:58

need some help here please:

Your img element should have the class smaller-image.

Your image should be 100 pixels wide. Browser zoom should be at 100%.

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

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

Boris
@Boris1011
Aug 16 2016 00:59
@Stormin-Norman Definitely :laughing: I'm the same!!
This message was deleted
Norvin Burrus
@ndburrus
Aug 16 2016 01:00
@NelsonRith :sparkles:
the link should be the 1st code line
Roman Ferrante
@Stormin-Norman
Aug 16 2016 01:00
^
NelsonRith
@NelsonRith
Aug 16 2016 01:00
as in the .smaller image code needs to be below the link?
Boris
@Boris1011
Aug 16 2016 01:01
the link should be above the <style> element
Norvin Burrus
@ndburrus
Aug 16 2016 01:01
@NelsonRith :sparkles:
  • link code, style element (with classes/elements), h2 element, etc.
Roman Ferrante
@Stormin-Norman
Aug 16 2016 01:02
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
  .smaller-image {
    width:100px;
  }
</style>
Young Mary-Claret Nnenna
@claretyoung20
Aug 16 2016 01:02

$(document).ready(function(){
var url1 = "http://ip-api.com/json";
var url;
var ct,country;
var getCity = function(data){
ct = data.city;
country = data.country;
$(".location").text(ct+", " + country);

    url = 'http://api.openweathermap.org/data/2.5/weather?'+'q='+ct+'&APPID=f7ec8f9583b86d92616709a348288dc3'; 
    var getDescritn = function(data) {
     var units = 'imperial';
     var temp = Math.round((data.main.temp)/10);
     var code = data.weather[0].icon;
     var images = '<img src="http://openweathermap.org/img/w/' + code + '.png" alt="Weather Icon">' ;
      var windUnit = units === 'metric' ? ' meters/s' : ' miles/h';
     var wspeed = data.wind.speed;
     var humidity = "Humidity "+data.main.humidity + "%";
     var descrition =data.weather[].description ;  

        $(".description").text("Description: "+ descrition);
        $(".deg").html(temp+'&deg;');
        $(".images").html(images);
        $(".wind").html(wspeed+windUnit);
        $(".humidity").html(humidity);
     $(".celsiu").css("color", "red");
     //-----------
     $(".celsiu").click(function() {
           $(".deg").html(temp + '&deg;'); 
            $(".frh").css("color", "white");
            $(".celsiu").css("color", "red");
        });
     //-----------------
      $(".frh").click(function() {
             var freh = Math.round(1.8*temp+32);
            $(".deg").html(freh+'&deg;'); 
            $(".frh").css("color", "red");
            $(".celsiu").css("color", "white");
        });
     //----------------------
     var bgim = 'url("https://images.trvl-media.com/media/content/shared/images/travelguides/destination/178307/Kerry-Park-61617.jpg")';
     var bg = ['url("http://wallpoper.com/images/00/37/46/99/lights-rain_00374699.jpg")','url("http://media.jrn.com/images/cloudy+skyline_1440892057022_23373091_ver1.0_640_480.jpg")','url("http://images.fineartamerica.com/images-medium-large-5/clear-mountain-sky-daniel-pivonka.jpg")','url("https://upload.wikimedia.org/wikipedia/commons/2/2f/Overcast_Mehamn.jpg")','url("http://www.pelfusion.com/wp-content/uploads/2009/07/cloudy.jpg")','url("http://71.18.74.5/wp-content/uploads/2013/05/Sunny-Day.jpg")','url("https://images.trvl-media.com/media/content/shared/images/travelguides/destination/178307/Kerry-Park-61617.jpg")','url("http://plentymore.files.wordpress.com/2012/08/bigstock-heart-from-cloud-o.gif")'];
     if(descrition === "light rain"){
        $('body').css('background-image',bg[0]);
     }else if(descrition === "mostly cloudy"){
          $('body').css('background-image',bg[1]);

     }else if(descrition === "clear sky"){
          $('body').css('background-image',bg[2]);

     }
     else if(descrition === "overcast clouds"){
          $('body').css('background-image',bg[3]);

     }
      else if(descrition === "cloudy"){
          $('body').css('background-image',bg[4]);

     }else if(descrition === "sunny"){
          $('body').css('background-image',bg[5]);
     }else if(descrition === "broken clouds"){
         $('body').css('background-image',bg[7]);
     }
     else{
         $('body').css('background-image',bg[6]);
     }
};


  $(document).ready(function() {
  $.getJSON(url, getDescritn, 'jsonp');
});

};

  $(document).ready(function() {
  $.getJSON(url1,getCity,'jsonp');
});

});

Norvin Burrus
@ndburrus
Aug 16 2016 01:03
''' @NelsonRith
CamperBot
@camperbot
Aug 16 2016 01:03
:bulb: to format code use backticks! ``` more info
Young Mary-Claret Nnenna
@claretyoung20
Aug 16 2016 01:03
i am working on weather show project but this function keep displaying the same thing since yesterdays
NelsonRith
@NelsonRith
Aug 16 2016 01:03

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

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

Norvin Burrus
@ndburrus
Aug 16 2016 01:03
@NelsonRith nice!
NelsonRith
@NelsonRith
Aug 16 2016 01:03
still not working though...
hmmm
Boris
@Boris1011
Aug 16 2016 01:04
@NelsonRith can you put up all of your code???
Norvin Burrus
@ndburrus
Aug 16 2016 01:04
@NelsonRith post entire code, please?
NelsonRith
@NelsonRith
Aug 16 2016 01:04

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

Margaret
@Margaret2
Aug 16 2016 01:05
@NelsonRith you have to put class="" inside your <img> tag
encount
@encount
Aug 16 2016 01:05
@NelsonRith you need to add the class to youer image
drummpro123
@drummpro123
Aug 16 2016 01:05
I need help guys
Laken Hafner
@LakenH
Aug 16 2016 01:05
you forgot the .smaller-image
Boris
@Boris1011
Aug 16 2016 01:05
@NelsonRith only should be 1 style element
<style>
.smaller-image {
width: 100px;
}
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}
</style>
Margaret
@Margaret2
Aug 16 2016 01:05
@drummpro123 what do you need help with
Norvin Burrus
@ndburrus
Aug 16 2016 01:06
@NelsonRith :sparkles:
  • there should be 4 elements within the style tag/s: .smaller-image, h2, & p.
  • also, only need one set of style tag/s
  • the image tag needs the class "smaller-image"
drummpro123
@drummpro123
Aug 16 2016 01:06
@Margaret2 I'm trying to use a CSS class to style an element
Let me show you the code

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

<h2>CatPhotoApp</h2>

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

Boris
@Boris1011
Aug 16 2016 01:06
@NelsonRith and you need a class="smaller-image" in the img element
drummpro123
@drummpro123
Aug 16 2016 01:06
Here are the instructions

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

NelsonRith
@NelsonRith
Aug 16 2016 01:07

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

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

h2 {
font-family: Lobster, Monospace;
}

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

Laken Hafner
@LakenH
Aug 16 2016 01:07
okay @drummpro123 , you need to change "h2" in your css to .red-text
then change blue to red
encount
@encount
Aug 16 2016 01:07
@NelsonRith <img class=“smaller-image” ……>
cvelazquez1215
@cvelazquez1215
Aug 16 2016 01:07

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

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

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

Laken Hafner
@LakenH
Aug 16 2016 01:07
don't foget to add class="red-text"
Boris
@Boris1011
Aug 16 2016 01:08
@NelsonRith yep and now you need class="smaller-image" in the image element
Margaret
@Margaret2
Aug 16 2016 01:08
@drummpro123 ok try to complete the first step
  • inside the <style> tags, change h2 to .red-text.
  • Then change the color to red instead of blue
NelsonRith
@NelsonRith
Aug 16 2016 01:08
ohhh I think I see now
haha
holllddd
cvelazquez1215
@cvelazquez1215
Aug 16 2016 01:08
passed thanks @Margaret2 @ndburrus
CamperBot
@camperbot
Aug 16 2016 01:08
cvelazquez1215 sends brownie points to @margaret2 and @ndburrus :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for margaret2
:star2: 1608 | @ndburrus |http://www.freecodecamp.com/ndburrus
Norvin Burrus
@ndburrus
Aug 16 2016 01:08
@NelsonRith see comment/s : :point_up: August 15, 2016 9:06 PM
@cvelazquez1215 you're welcome! excellent work! :palm_tree:
NelsonRith
@NelsonRith
Aug 16 2016 01:09
aweeesome got it!
thank you guys!
cvelazquez1215
@cvelazquez1215
Aug 16 2016 01:10
@Margaret2
Boris
@Boris1011
Aug 16 2016 01:10
@NelsonRith :+1:
Lauren Best
@laurennbestt
Aug 16 2016 01:10
you guys know how in an element, when you type 'class' it's green?
Can someone help me out with the lesson 'prioritize one style over another'
NelsonRith
@NelsonRith
Aug 16 2016 01:11
@ndburrus thank you
CamperBot
@camperbot
Aug 16 2016 01:11
nelsonrith sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1609 | @ndburrus |http://www.freecodecamp.com/ndburrus
Boris
@Boris1011
Aug 16 2016 01:11
@laurennbestt what do you have for your code???
Margaret
@Margaret2
Aug 16 2016 01:11
@laurennbestt sure what code have you done so far
NelsonRith
@NelsonRith
Aug 16 2016 01:11
@Boris1011 thank you
CamperBot
@camperbot
Aug 16 2016 01:11
nelsonrith sends brownie points to @boris1011 :sparkles: :thumbsup: :sparkles:
:cookie: 193 | @boris1011 |http://www.freecodecamp.com/boris1011
Boris
@Boris1011
Aug 16 2016 01:11
@NelsonRith anytime mate!!!
NelsonRith
@NelsonRith
Aug 16 2016 01:11
@Margaret2 thank you
CamperBot
@camperbot
Aug 16 2016 01:11
nelsonrith sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for margaret2
Henry Cabello
@hacu9
Aug 16 2016 01:11
Is this correct for using important? }
.pink-text {
color: pink !important;
Margaret
@Margaret2
Aug 16 2016 01:12
@hacu9 that looks right, but you're missing a closing bracket }
encount
@encount
Aug 16 2016 01:13
@laurennbestt css work top down
so: h1 { color:green }
h1 { color: red}
will make h1 red
Henry Cabello
@hacu9
Aug 16 2016 01:13
I just missed copying it,anyways it seems to be correct but my text is still white e-e
Boris
@Boris1011
Aug 16 2016 01:14
@hacu9 what do you have for the rest of your code???
Lauren Best
@laurennbestt
Aug 16 2016 01:14

Sometimes your HTML elements will receive multiple styles that conflict with one another.

For example, your h1 element can't be both green and pink at the same time.

Let's see what happens when we create a class that makes text pink, then apply it to an element. Will our class override the body element's color: green; CSS property?

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

Give your h1 element the class of pink-text.

Run tests (ctrl + enter)
Reset Help Bug
Your h1 element should have the class pink-text.
Your <style> should have a pink-text CSS class with its color set to pink.
Your h1 element should be pink.

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

</style>

<h1><p>Hello World</p>

so what should i do?
Margaret
@Margaret2
Aug 16 2016 01:14
@hacu9 include the class in your h1 element
Henry Cabello
@hacu9
Aug 16 2016 01:14

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

orange-text {

color: orange;

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

<h1 id="orange-text" class="pink-text; blue-text" style="color: white">Hello World!</h1>

Margaret
@Margaret2
Aug 16 2016 01:15
@hacu9 do not include ; between classes, you only need a space
Lauren Best
@laurennbestt
Aug 16 2016 01:15
does this apply to me too ? @Margaret2
Wesley Schulte
@WesSchulte
Aug 16 2016 01:15
when this asks for me to put that lobster link in the top of my code editor does that mean copy and paste it to line 1?
Henry Cabello
@hacu9
Aug 16 2016 01:15
@Margaret2 Thanks!
CamperBot
@camperbot
Aug 16 2016 01:15
hacu9 sends brownie points to @margaret2 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for margaret2
Henry Cabello
@hacu9
Aug 16 2016 01:15
That worked xD
Margaret
@Margaret2
Aug 16 2016 01:16
@laurennbestt a space between classes? yes
Henry Cabello
@hacu9
Aug 16 2016 01:16
@WesSchulte yes
Lauren Best
@laurennbestt
Aug 16 2016 01:16
no the whole thing you posted @Margaret2
Eldon55
@Eldon55
Aug 16 2016 01:16
need
help
CamperBot
@camperbot
Aug 16 2016 01:16

CamperBot

Hi, I'm CamperBot! I can help you in this chatroom :smile:

Basic Commands:

  • find TOPIC find all entries about topic. e.g. find js
  • wiki TOPIC show contents of topic page
  • thanks @username send brownie points to another user
  • about @username shows info on that user
  • Algorithm BONFIRENAME info on a Algorithm

meet CamperBot in FreeCodeCamp/camperbotPlayground

:pencil: read more about camperbot on the FCC Wiki

encount
@encount
Aug 16 2016 01:16
@laurennbestt in the styles .pink-text { color:pink} then add the class to your h1 tag
Margaret
@Margaret2
Aug 16 2016 01:17
@laurennbestt well since you're working on the same challenge, yeah sure
Boris
@Boris1011
Aug 16 2016 01:18
@Eldon55 what's up!?
Eldon55
@Eldon55
Aug 16 2016 01:18
@Boris1011 can you show me how set an img in the center
Margaret
@Margaret2
Aug 16 2016 01:19
@laurennbestt you have to create the .pink-text{} class and also include it in your h1 element like i just showed hacu9
Boris
@Boris1011
Aug 16 2016 01:19
This message was deleted
Eldon55
@Eldon55
Aug 16 2016 01:19
xD
Boris
@Boris1011
Aug 16 2016 01:20

@Eldon55 try something like

<style>
p {
text-align:center;
}
</style>
<p>
<img whatever else goes here>
</p>

This is how I would do it!!

Eldon55
@Eldon55
Aug 16 2016 01:21
@Boris1011 i tried text align but didnt work
Laken Hafner
@LakenH
Aug 16 2016 01:21
did you put it inside of the p tag?
and put text-align on the p tag?
Eldon55
@Eldon55
Aug 16 2016 01:21
@Boris1011 maybe i need to add a paragraph
Boris
@Boris1011
Aug 16 2016 01:21
did you have say in a <p> element???? it would work then!! @Eldon55
Eldon55
@Eldon55
Aug 16 2016 01:21
@Boris1011 @LakenH k thank you guys
CamperBot
@camperbot
Aug 16 2016 01:21
eldon55 sends brownie points to @boris1011 and @lakenh :sparkles: :thumbsup: :sparkles:
:cookie: 197 | @boris1011 |http://www.freecodecamp.com/boris1011
:cookie: 42 | @lakenh |http://www.freecodecamp.com/lakenh
Kevin Mulligan
@kmulligan
Aug 16 2016 01:22
@Eldon55
<img class="img-responsive center-block"> if you are using bootstrap
Boris
@Boris1011
Aug 16 2016 01:22
@Eldon55 anytime mate!!!! :+1: :smile:
Eldon55
@Eldon55
Aug 16 2016 01:22
@kmulligan nah i dont use bootstrap
btw one more question
Boris
@Boris1011
Aug 16 2016 01:23
go for it!!!!
Eldon55
@Eldon55
Aug 16 2016 01:23
do i need to use alt bc of when i use it in text editor i dont really use it
Laken Hafner
@LakenH
Aug 16 2016 01:24
tbh, I don't really use it, but it is good practice
Kevin Mulligan
@kmulligan
Aug 16 2016 01:24
@Eldon55 on the image?
Eldon55
@Eldon55
Aug 16 2016 01:24
@kmulligan yup
Kevin Mulligan
@kmulligan
Aug 16 2016 01:24
@Eldon55 It's best practice so yea I would do it
Boris
@Boris1011
Aug 16 2016 01:24
I don't usually use it unless I really need to or the challenge says that I need it....
Eldon55
@Eldon55
Aug 16 2016 01:25
k
Laken Hafner
@LakenH
Aug 16 2016 01:25
If you know someone is going to use your site with a screenreader or a poor connection always use it
because if the image fails to load, it will display the alt text, telling the user what the image is
Kevin Mulligan
@kmulligan
Aug 16 2016 01:26
@Eldon55 IMO best to get in habit of good practices so that when you're designing for $ you're implementing that practice. Google likes it too, for the reasons @LakenH mentioned
Eldon55
@Eldon55
Aug 16 2016 01:26
ooh k i didnt know that @LakenH
Boris
@Boris1011
Aug 16 2016 01:26
@LakenH I guess that makes sense!!
fair enough too!!
Eldon55
@Eldon55
Aug 16 2016 01:27
k guys thank you
brb
Kevin Mulligan
@kmulligan
Aug 16 2016 01:27
I'm out, good evening all
Wesley Schulte
@WesSchulte
Aug 16 2016 01:27
im struggling to make this damn kitty smaller
Laken Hafner
@LakenH
Aug 16 2016 01:27
can I see your code @WesSchulte ?
Boris
@Boris1011
Aug 16 2016 01:28
@WesSchulte what is your code???? and the challenge name???
greg
@wearenotgroot
Aug 16 2016 01:28
@WesSchulte well when cats grows they get bigger :smile:
Laken Hafner
@LakenH
Aug 16 2016 01:29
I'm assuming it's the "size your images" challenge?
Wesley Schulte
@WesSchulte
Aug 16 2016 01:29
yes its the size your images one!
do i style it under or above the <img
Laken Hafner
@LakenH
Aug 16 2016 01:29
you should keep all your styles within the <style> tags up top
good practice
and give your image the class of "smaller-image"
Wesley Schulte
@WesSchulte
Aug 16 2016 01:30
they will all work under one <style> ? i feel slopping doing it a bunch
Laken Hafner
@LakenH
Aug 16 2016 01:30
yep
Wesley Schulte
@WesSchulte
Aug 16 2016 01:30
i love you guys
greg
@wearenotgroot
Aug 16 2016 01:30
@WesSchulte create in <style></style>-------->Create a class called smaller-image and use it to resize the image so that it's only 100 pixels wide
Laken Hafner
@LakenH
Aug 16 2016 01:30
later on, you'll keep all your styles on one separate file too
Wesley Schulte
@WesSchulte
Aug 16 2016 01:31
when i make facebook 2.0 you all get a share!
Laken Hafner
@LakenH
Aug 16 2016 01:31
you figured it out? :)
Wesley Schulte
@WesSchulte
Aug 16 2016 01:31
<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

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

.smaller-image {
width: 100px;
}
</style>
i did it like that and its not working
Laken Hafner
@LakenH
Aug 16 2016 01:32
looks right, did you give the <img> a class of smaller-image?
Wesley Schulte
@WesSchulte
Aug 16 2016 01:32
i did not how do i do that
greg
@wearenotgroot
Aug 16 2016 01:32
@WesSchulte look at your h2 same thing class="..."
Jack
@JackMcGowan
Aug 16 2016 01:32
How do I replace my href with #
anybody/
Laken Hafner
@LakenH
Aug 16 2016 01:33
let's say we want to add a class of "text" you'd do <img class="text">
so you want to do <img class="smaller-image">
greg
@wearenotgroot
Aug 16 2016 01:33
@JackMcGowan change the to href = "#" in your <a>
Norvin Burrus
@ndburrus
Aug 16 2016 01:33
@NelsonRith you're welcome! nice job! :palm_tree:
@JackMcGowan :sparkles:
<a href="#">
Wesley Schulte
@WesSchulte
Aug 16 2016 01:35
@LakenH it make my image go to 100 pix wide but then its saying my element isnt named smaller image WTF hahaha
Jack
@JackMcGowan
Aug 16 2016 01:35
<p>Click here for <a href=#>cat photos</a>.</p>
Wont work for some reason.
Laken Hafner
@LakenH
Aug 16 2016 01:35
can I see your code @WesSchulte ?
greg
@wearenotgroot
Aug 16 2016 01:35
@JackMcGowan dont forget the ""
Laken Hafner
@LakenH
Aug 16 2016 01:35
might just be a typo
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:35
Need quotes around #
Wesley Schulte
@WesSchulte
Aug 16 2016 01:35
i just reset it haha im diving back in one moment
Norvin Burrus
@ndburrus
Aug 16 2016 01:36
@WesSchulte where is the link?
Jack
@JackMcGowan
Aug 16 2016 01:36
do I keep the 'cat photos' park
Andy Truett
@andytruett
Aug 16 2016 01:36
@JackMcGowan are you trying to link to an ID on the same page?
Jack
@JackMcGowan
Aug 16 2016 01:36

ometimes you want to add a elements to your website before you know where they will link.

This is also handy when you're changing the behavior of a link using jQuery, which we'll learn about later.

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.

Run tests (ctrl + enter)
Reset Help Bug
Your a element should be a dead link with a href attribute set to "#".

<p>Click here for <a href="#"></a></p>
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:36
Yes thats the text that will show as a link @JackMcGowan
Jack
@JackMcGowan
Aug 16 2016 01:37
@coffeebeanzz
It still is not working for
<p>Click here for <a href="http://www.freecatphotoapp.com">cat photos</a>.</p>
when I change the link to a #
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:38
Dud u try "#"? Need those "
greg
@wearenotgroot
Aug 16 2016 01:39
@JackMcGowan try a page refresh?
Laken Hafner
@LakenH
Aug 16 2016 01:39
heading off for the night, goodnight
greg
@wearenotgroot
Aug 16 2016 01:40
@LakenH have a good :zzz:
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:40
Nite! Sweet dreams @LakenH
Norvin Burrus
@ndburrus
Aug 16 2016 01:40
@JackMcGowan :sparkles:
need "#", here: href=**here**http:
Wesley Schulte
@WesSchulte
Aug 16 2016 01:41
@LakenH i got it to work!!! I hope you find a $20 on the ground the next time youre walking around
Norvin Burrus
@ndburrus
Aug 16 2016 01:42
@WesSchulte nice work! excellent! :palm_tree:
... time for a walk!
Jack
@JackMcGowan
Aug 16 2016 01:42
Like this?
<p>Click here for <a href="#""http://www.freecatphotoapp.com">cat photos</a>.</p>
greg
@wearenotgroot
Aug 16 2016 01:42
@JackMcGowan replace the entire http://www.freecatphotoapp.com with "#"
Boris
@Boris1011
Aug 16 2016 01:42
@JackMcGowan take out the link that you have so it is just <a href="#">
Jack
@JackMcGowan
Aug 16 2016 01:42
I have did this @Boris1011 & @wearenotgroot
Norvin Burrus
@ndburrus
Aug 16 2016 01:43
@JackMcGowan :sparkles:
remove the link, here: "http://www.freecatphotoapp.com"
greg
@wearenotgroot
Aug 16 2016 01:43

@JackMcGowan like that?

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

if it's not working, have you change anything else?

Jack
@JackMcGowan
Aug 16 2016 01:44
yes!
Boris
@Boris1011
Aug 16 2016 01:44
well that should work!?
Norvin Burrus
@ndburrus
Aug 16 2016 01:44
@JackMcGowan nice work! way to go! :palm_tree:
Is this a bug or something lol
greg
@wearenotgroot
Aug 16 2016 01:45
@JackMcGowan try a reset or a page refresh?
akashkumar77
@akashkumar77
Aug 16 2016 01:45
Hey, does this look right to you guys? .thick-green-border {
border-color:"green"
border-width:"10px"
border-style:"solid"
}
greg
@wearenotgroot
Aug 16 2016 01:45
@akashkumar77 missing ;
Jack
@JackMcGowan
Aug 16 2016 01:46
yep it was a bug lmfao
thank god.
akashkumar77
@akashkumar77
Aug 16 2016 01:46
oh thanks!
Jack
@JackMcGowan
Aug 16 2016 01:46
thanks guys/
Coy Sanders
@coymeetsworld
Aug 16 2016 01:46
width also shouldn't be in quotes @akashkumar77
greg
@wearenotgroot
Aug 16 2016 01:46
@akashkumar77 shoul be
attributename: value;
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:46
@JackMcGowan :thumbsup:
akashkumar77
@akashkumar77
Aug 16 2016 01:46
yes! awesome
Boris
@Boris1011
Aug 16 2016 01:46
@akashkumar77 take out the " "
.thick-green-border {
border-color:green;
border-width:10px;
border-style:solid;
}
akashkumar77
@akashkumar77
Aug 16 2016 01:47
i fixed it :smile:
greg
@wearenotgroot
Aug 16 2016 01:47
@akashkumar77 :+1:
Boris
@Boris1011
Aug 16 2016 01:47
:+1:
Eldon55
@Eldon55
Aug 16 2016 01:50
back i need help xD
Wesley Schulte
@WesSchulte
Aug 16 2016 01:50
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
i have that in my style
but how do i combine classes? i think thats what im missing
Oliver
@Marcuz314
Aug 16 2016 01:51
I'm stuck at size your image...the code won't work and i cant figure out if its the zoom or not.....i wrote it in alliance to the example...what am i doing wrong?
Wesley Schulte
@WesSchulte
Aug 16 2016 01:51
combine was a poor choice of word. how do i apply this
Joshua S Corpuz
@jshcrpz
Aug 16 2016 01:52
hey guys, for my tribute page. do i only have to stick with html just like in the video or do i have to use css too?
Eldon55
@Eldon55
Aug 16 2016 01:52
@WesSchulte
.thick-green-border {
border: 10px solid green;
}
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 01:52
@WesSchulte just make some space between them like this class="class1 class2"
Wesley Schulte
@WesSchulte
Aug 16 2016 01:53
and i call it class1 and class2?
Eldon55
@Eldon55
Aug 16 2016 01:53
i need help
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 01:53
@jshcrpz i think that you should do it with the bootstrap, it's mean using bootstrap classes, no css
@Eldon55 how can i help you ?
Eldon55
@Eldon55
Aug 16 2016 01:54
@Ilyes-Hammadi first take a look at me code pen
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 01:54
okey
Joshua S Corpuz
@jshcrpz
Aug 16 2016 01:54
@Ilyes-Hammadi alright thank you :)!
CamperBot
@camperbot
Aug 16 2016 01:54
jshcrpz sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 294 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
Eldon55
@Eldon55
Aug 16 2016 01:55
@jshcrpz do you see the image in the bottom
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 01:56
@Eldon55 what do i need to see exactly ?
Norvin Burrus
@ndburrus
Aug 16 2016 01:56
@Marcuz314 can you post?
Eldon55
@Eldon55
Aug 16 2016 01:57
@Ilyes-Hammadi i want to add a paragraph or a text in the right and left of the img, do you know how to do that
coffeebeanzz
@coffeebeanzz
Aug 16 2016 01:57
@jshcrpz you can use whatever you like, that part about the HTML is misleading... HTML is the structure of your website and CSS is the style and Bootstrap is a CSS framework.. so you can use all 3 or 2 the choice is yours
Norvin Burrus
@ndburrus
Aug 16 2016 01:57
@WesSchulte use the class (defined in the style stags) in the element
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 01:58
@Eldon55 you can use the bootstrap col system, first column for the left text, the middle one for the image and the last one for the right text
Santiago Gómez
@Sperkajugglite
Aug 16 2016 01:59
i have to go
have a great, productive night guys!! :P
Rohan Parikh
@RohanParikh00
Aug 16 2016 01:59
@Sperkajugglite bye gn!
Santiago Gómez
@Sperkajugglite
Aug 16 2016 01:59
@RohanParikh00 bye man :)
Eldon55
@Eldon55
Aug 16 2016 01:59
@Ilyes-Hammadi ohh right i think i can do that thank you
CamperBot
@camperbot
Aug 16 2016 01:59
eldon55 sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 295 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:00
@Eldon55 you are welcome, good luck :smile: :+1:
Wesley Schulte
@WesSchulte
Aug 16 2016 02:03

.smaller-image {
width: 100px;
}

.thick-green-border {
border-color: green;
border-width: 10px solid green;
}
</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. "> i have all this put in but the borders wont change

and im very confused about where/how to apply multiple classes
Boris
@Boris1011
Aug 16 2016 02:04
@WesSchulte class="smaller-image thick-green-border"
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:04
@WesSchulte use border not border-width
Boris
@Boris1011
Aug 16 2016 02:05
@WesSchulte and ^
Wesley Schulte
@WesSchulte
Aug 16 2016 02:05
you guys a fucking wizards i swear to god
*are
Norvin Burrus
@ndburrus
Aug 16 2016 02:06
This message was deleted
Boris
@Boris1011
Aug 16 2016 02:06
nope, just a total noob who has learnt to spot things!!!
Lauren Best
@laurennbestt
Aug 16 2016 02:12

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

</style>

<h1><p>Hello World</p>

whats wrong with this? I'm trying to make the second image mobile responsive.

Boris
@Boris1011
Aug 16 2016 02:12
is the "Hello World" meant to be a <h1> or <p> ???
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:13
@laurennbestt I don't see multiple images, or any images at all
Lauren Best
@laurennbestt
Aug 16 2016 02:13
<h1 <p> Hello world </p> @Boris1011
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:13
"In JavaScript, scope refers to the visibility of variables." What does it mean by visibility of variables?
@laurennbestt whats the challenge name?
Lauren Best
@laurennbestt
Aug 16 2016 02:13
sorry its <h1 <p> Hello world </p> </h1>
@Boris1011
'Make Images Mobile Responsive' @RohanParikh00
Boris
@Boris1011
Aug 16 2016 02:14
@laurennbestt I don't think you can have a paragraph in a heading.... it has to be either one or the other!!
Lauren Best
@laurennbestt
Aug 16 2016 02:15
did you try it?
@Boris1011
what's the assignment name? @Boris1011
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:16
@laurennbestt can you put your entire code on the chat?
Lauren Best
@laurennbestt
Aug 16 2016 02:17

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

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

Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:18
@laurennbestt what's the problem exactly ?
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:18
@laurennbestt it doesn't look like you even added the second image
@laurennbestt nvm I se it
see*
Lauren Best
@laurennbestt
Aug 16 2016 02:18
@Ilyes-Hammadi i need to make the second image mobile responsive
is it because i don't have the alt for the second image?
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:19
@laurennbestt i think you just need to add the class responsive
in the img tag
Norvin Burrus
@ndburrus
Aug 16 2016 02:20
@laurennbestt :sparkles:
  • need closing a tag
  • need semicolon between class & src in img tag/s
  • for a element/s, for is <a...><img...></a>
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:21
@laurennbestt nope I figured out the problem
your img source is wrong, for the second img, you did http instead of https
everything else is right
it doesn't let you pass bc one of the requirements is "Your new image should have a src of https://bit.ly/fcc-running-cats. "
did it work?
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:27
also @laurennbestt just an fyi, you technically don't need "alt" for an image, the program will run anyways. it's just helpful for the user
Marc Vazquez
@dashark69
Aug 16 2016 02:33
hello anyone done this part ?
Add Font Awesome Icons to our Buttons
Agarza1921
@Agarza1921
Aug 16 2016 02:33
question how do IDs of an element work? im doing the challenge where you give your form element the id
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:33
@dashark69 yup I can help
both of you @Agarza1921
Marc Vazquez
@dashark69
Aug 16 2016 02:34
ok.. I accidentally erase my code ..one sec
Agarza1921
@Agarza1921
Aug 16 2016 02:35
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality" checked> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Energetic</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:35
cool just post your entire code and tell me what u need help with
Agarza1921
@Agarza1921
Aug 16 2016 02:35
that is my form element correct?
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:35
yup
Agarza1921
@Agarza1921
Aug 16 2016 02:35
i have to give it an element id of cat-photo-form
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:36
@Agarza1921 add the id="" in the form tag and you are done
Rohan Parikh
@RohanParikh00
Aug 16 2016 02:36
@Ilyes-Hammadi yup @Agarza1921
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:36
<form id="cat-photo-form"></form>
Marc Vazquez
@dashark69
Aug 16 2016 02:39
@RohanParikh00
  <button i class="fa fa-thumbs-up" class="btn btn-block btn-primary" </i>>Like</button>
Agarza1921
@Agarza1921
Aug 16 2016 02:39
thanks @RohanParikh00
CamperBot
@camperbot
Aug 16 2016 02:39
agarza1921 sends brownie points to @rohanparikh00 :sparkles: :thumbsup: :sparkles:
:cookie: 191 | @rohanparikh00 |http://www.freecodecamp.com/rohanparikh00
Marc Vazquez
@dashark69
Aug 16 2016 02:39
not sur if or wher the </i> goes..
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:40
@dashark69 it's should be like this <button><i></i></button>
Marc Vazquez
@dashark69
Aug 16 2016 02:41
is <i> before or after the text " button" ?
or does it even matter ?
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:41
it does not matter @dashark69
Marc Vazquez
@dashark69
Aug 16 2016 02:42
i see my big mistake now... the < is not the same as the < already in front of button.. first < is button and then one for <i>.. @Ilyes-Hammadi
follows.. thanks @Ilyes-Hammadi
CamperBot
@camperbot
Aug 16 2016 02:43
dashark69 sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
luiyi
@luiyi01
Aug 16 2016 02:43
hello
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:43
@dashark69 you are welcome, good luck :smile:
@luiyi01 Hey !!
quilaura
@quilaura
Aug 16 2016 02:44
hey, could someone help me with one of these challenges? i'm having trouble with the container-fluid class
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:44
@quilaura how can i help ?
quilaura
@quilaura
Aug 16 2016 02:45
"To get started, we should nest all of our HTML in a div element with the class container-fluid."
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:45
okey, and ?
quilaura
@quilaura
Aug 16 2016 02:45
I can't figuure out how to do that. am i supposed to put something in the style section?

like div {
container-fluid

or something?

Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:46
@quilaura try this,
<div class="container-fluid">
   Your tags goes here !!
</div>
quilaura
@quilaura
Aug 16 2016 02:47
oh, that solved it!! thank you so much
greg
@wearenotgroot
Aug 16 2016 02:47
@quilaura container-fluid is a bootstrap class so no need to create it just need to apply it to a div
quilaura
@quilaura
Aug 16 2016 02:47
ahh okay
aardvark11100
@aardvark11100
Aug 16 2016 02:48

<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" 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 do you put a smaller-image and a thick-green-border class in the same img element?
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:49
@aardvark11100 class="class1 class2"
you just need to put some space between them
aardvark11100
@aardvark11100
Aug 16 2016 02:51
@Ilyes-Hammadi
@Ilyes-Hammadi thanks you da man
CamperBot
@camperbot
Aug 16 2016 02:52
aardvark11100 sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:52
@aardvark11100 you are welcome, good luck :smile:
sean
@seananthony813
Aug 16 2016 02:58

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

p {
font-size: 16px;
}

</style>

<h2 class="red-text">CatPhotoApp</h2>
<p{font-family,sans-serif,monospace; }</p>

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

Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 02:59
@seananthony813 <p{font-family,sans-serif,monospace; }</p> this is wrong
sean
@seananthony813
Aug 16 2016 03:00
can u give me an exanple
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:01
use this in your <style></style> like this
<style>
  ...
  p {
      font-family,sans-serif, Monospace;
   }
</style>
Zach4531
@Zach4531
Aug 16 2016 03:01
can anyone help me?
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:01
@Zach4531 how can i help you ?
May
@xSpideyx
Aug 16 2016 03:02
Guys can you look at my code and tell me why my "Home" and "contact" links don't work either.https://codepen.io/Spidey/pen/akRaBr
Luna
@Lunababe1995
Aug 16 2016 03:03
你的p元素应该包含文本"View more ",注意more后面有一个空格。
文本应该写到哪里啊
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:03
@Lunababe1995 in english please.
Luna
@Lunababe1995
Aug 16 2016 03:03
OK
where can I write down the text?
Sami64
@Sami64
Aug 16 2016 03:05
How do i create a button element
Zach4531
@Zach4531
Aug 16 2016 03:05
@Ilyes-Hammadi Nevermind. Everytime i come here to ask I just clicks with me lol
May
@xSpideyx
Aug 16 2016 03:06
<button> </button> @Sami64
Sami64
@Sami64
Aug 16 2016 03:07
thanks
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:07
@Zach4531 lol, okey, i am available if you need help.
May
@xSpideyx
Aug 16 2016 03:07
that's a button element @Sami64
Zach4531
@Zach4531
Aug 16 2016 03:07
@Ilyes-Hammadi Thanks!
CamperBot
@camperbot
Aug 16 2016 03:07
zach4531 sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 300 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
aardvark11100
@aardvark11100
Aug 16 2016 03:07
I'm having trouble with the nesting element

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

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

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

Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:08
@xSpideyx there are some problems with your Js, you have declared this class "scrollTo" and you are using in the Jquery this class "scroll.To"
May
@xSpideyx
Aug 16 2016 03:09
@aardvark11100 nesting means to put a element inside of another existing element
Norvin Burrus
@ndburrus
Aug 16 2016 03:09
@Lunababe1995 这些可能是有用的︰ :sparkles:
aardvark11100
@aardvark11100
Aug 16 2016 03:10
yeah @xSpideyx i tried to put the a element inside of the p element but i don't think I did it right <p> View more <a href="http://www.freecatphotoapp.com">cat photos</a> </p>
<p> View more <a href="http://www.freecatphotoapp.com">cat photos</a> </p>
May
@xSpideyx
Aug 16 2016 03:11
@aardvark11100 whats the name of the level your on
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:11
@aardvark11100 if the problem persists, try reloading the page.
aardvark11100
@aardvark11100
Aug 16 2016 03:12
@xSpideyx It's called "Nest an Anchor Element within a paragraph"
Sopheak Yim
@yim-sopheak
Aug 16 2016 03:13
hi guys.
aardvark11100
@aardvark11100
Aug 16 2016 03:13
whaddup
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:13
@xSpideyx data-scrollTo="contact" and the div id is "Contact" it will not work like this, contact != Contact, the ids are case sensitive
chantaldesiree
@chantaldesiree
Aug 16 2016 03:14
Hi Guys, I'm having a bit of trouble aligning responsive thumbnails in my portfolio project.. Any chance someone might be able to tell me where I'm going wrong? I'd like to get rid of the space in between the top and bottom rows, also, when it's viewed on mobile, it creates about a 2% margin on the right hand side. http://codepen.io/chantaldesiree/pen/EKzqrB
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:14
@yim-sopheak Welcome
Norvin Burrus
@ndburrus
Aug 16 2016 03:14
@aardvark11100 :sparkles:
  • remove space, here: <p> View m
  • and here: more <a
@aardvark11100 is it resolved?
May
@xSpideyx
Aug 16 2016 03:16
@aardvark11100 when you try to run tests which objectives turn red
aardvark11100
@aardvark11100
Aug 16 2016 03:17
@xSpideyx No, didn't quite get it.
"Create a new p element around your a element"
Norvin Burrus
@ndburrus
Aug 16 2016 03:17
''' @Lunababe1995
CamperBot
@camperbot
Aug 16 2016 03:17
:bulb: to format code use backticks! ``` more info
aardvark11100
@aardvark11100
Aug 16 2016 03:17
"Your a element should be nested within your new p element"
and "Your p element should have the text 'View more' (with a space after it)
May
@xSpideyx
Aug 16 2016 03:18
@Ilyes-Hammadi thanks dude
CamperBot
@camperbot
Aug 16 2016 03:18
xspideyx sends brownie points to @ilyes-hammadi :sparkles: :thumbsup: :sparkles:
:cookie: 301 | @ilyes-hammadi |http://www.freecodecamp.com/ilyes-hammadi
Norvin Burrus
@ndburrus
Aug 16 2016 03:18
@aardvark11100 :point_up: see previous comment/s
Ilyes Hammadi
@Ilyes-Hammadi
Aug 16 2016 03:19
@xSpideyx good luck Spidey 😃
aardvark11100
@aardvark11100
Aug 16 2016 03:19
im sorry @ndburrus I don't understand
Norvin Burrus
@ndburrus
Aug 16 2016 03:20
@aardvark11100 were the excess spaces removed?
aardvark11100
@aardvark11100
Aug 16 2016 03:21
yeah
<p>View more<a href="http://www.freecatphotoapp.com">cat photos</a> </p>
Norvin Burrus
@ndburrus
Aug 16 2016 03:21
@aardvark11100 can you post?
aardvark11100
@aardvark11100
Aug 16 2016 03:21
that's the code i currently have
Agarza1921
@Agarza1921
Aug 16 2016 03:21
prioritize one style over another. it seems ive forgotten everything i just learned lol i need to give an h1 element the class pink-text while my style should have a pink-text css class with its color set to pink
Norvin Burrus
@ndburrus
Aug 16 2016 03:21
@aardvark11100 remove the space/s before & after View more
Agarza1921
@Agarza1921
Aug 16 2016 03:22

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

<h1>Hello World!</h1>

aardvark11100
@aardvark11100
Aug 16 2016 03:23
@ndburrus still can't get it
Norvin Burrus
@ndburrus
Aug 16 2016 03:23
@Agarza1921 :sparkles:
  • we need to add class within the style tag/s. reference the instructions, here: Create a CSS class called pink-text that gives an element the color pink.
  • next, we need to do this Give your h1 element the class of pink-text.
@aardvark11100 can you post?
Martin Delgado
@herweg
Aug 16 2016 03:24
hello there, i need help in the #78 class, can samone giveme a tip?
aardvark11100
@aardvark11100
Aug 16 2016 03:24

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

@ndburrus
Norvin Burrus
@ndburrus
Aug 16 2016 03:25
@aardvark11100 where is the link - 1st line of code?
... and add a space after more (sorry... :) )
pavisri
@pavisri
Aug 16 2016 03:25
hey everyone
May
@xSpideyx
Aug 16 2016 03:25
put a space after "View more" @aardvark11100
pavisri
@pavisri
Aug 16 2016 03:26
How to center the bullet points of <ul> in bootstrap?
aardvark11100
@aardvark11100
Aug 16 2016 03:26
here's the complete code

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

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

Martin Delgado
@herweg
Aug 16 2016 03:27
i need a tip here https://www.freecodecamp.com/challenges/responsively-style-radio-buttons cant figure out the solution, as i understund it, i've to change a "4" to a "6"
Norvin Burrus
@ndburrus
Aug 16 2016 03:28
@aardvark11100 change httpsto http1st code line/link
aardvark11100
@aardvark11100
Aug 16 2016 03:30
@ndburrus did that and still can't get it. Appreciate you helping me man, sorry for being so frustrating.
Norvin Burrus
@ndburrus
Aug 16 2016 03:32
@aardvark11100 ...no worries...was https changed?
Martin Delgado
@herweg
Aug 16 2016 03:32
anyone? :/
Norvin Burrus
@ndburrus
Aug 16 2016 03:33
@herweg ok, let me take a look
aardvark11100
@aardvark11100
Aug 16 2016 03:33
yeah i changed the https on the first line of code to http
Norvin Burrus
@ndburrus
Aug 16 2016 03:33
@herweg can you post your code, like this?
''' @herweg
CamperBot
@camperbot
Aug 16 2016 03:33
:bulb: to format code use backticks! ``` more info
Martin Delgado
@herweg
Aug 16 2016 03:35
AWTS thanks for the help anyway, i got it
:D
Norvin Burrus
@ndburrus
Aug 16 2016 03:35
@herweg :+1:
sean
@seananthony813
Aug 16 2016 03:36

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

p {
font-size: 16px;
}

</style>

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

<style> {font-family,sans-serif,monospace;
}</p>

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

rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 03:36
how do you change brozer zoom
Norvin Burrus
@ndburrus
Aug 16 2016 03:38
@seananthony813 :sparkles:
  • need the link - 1st code line
  • need .smaller-image & h2 elements within style tags
  • need font-family (Monospace), inside p element within style tag/s
  • the style tags (opening and closing) should contain 4 elements: .red-text, .smaller-image, h2, & p
  • need img tag (with class "smaller-image"), between h2 & 1st p tag
  • last p tag needs class ("red-text")
chantaldesiree
@chantaldesiree
Aug 16 2016 03:38
@rostyslavsagadyn You should be able to hit Ctrl and + or Ctrl and - / Cmd on Mac, I think.
Norvin Burrus
@ndburrus
Aug 16 2016 03:43
@rostyslavsagadyn which browser?
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 03:43

<style>
.smaller-image {
width: 100pcx:
}
</style>
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

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

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

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

trying to make the cat picture fit
chantaldesiree
@chantaldesiree
Aug 16 2016 03:44
should be 100px not pcx
Norvin Burrus
@ndburrus
Aug 16 2016 03:44
@rostyslavsagadyn :sparkles:
  • width: 100pcx should be width: 100px
  • link should be 1st code line
  • need only 1 set of style tags
chantaldesiree
@chantaldesiree
Aug 16 2016 03:44
also a ; not :
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 03:44
thanks
it worked
Norvin Burrus
@ndburrus
Aug 16 2016 03:47
@rostyslavsagadyn review these notes: :point_up: August 15, 2016 11:38 PM
@rostyslavsagadyn :+1:
Malcolm
@holdenator55
Aug 16 2016 03:49

What does this mean? "Your stylesheet should declare a red-text class and have its color set to red. " My code is this: <style>
h2 {
color: red;
}
</style>

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

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

Boris
@Boris1011
Aug 16 2016 03:50
@holdenator55 change the h2 in the style element to .red-text, so
<style>
.red-text{
color:red;
}
</style>
Programotion1
@Programotion1
Aug 16 2016 03:50
I did my first tribute page> http://cdpn.io/WxLNVw
Malcolm
@holdenator55
Aug 16 2016 03:50
Okay it worked. Thanks! @Boris1011
CamperBot
@camperbot
Aug 16 2016 03:50
holdenator55 sends brownie points to @boris1011 :sparkles: :thumbsup: :sparkles:
:cookie: 212 | @boris1011 |http://www.freecodecamp.com/boris1011
Boris
@Boris1011
Aug 16 2016 03:51
@holdenator55 Any time mate!!! :+1:
Programotion1
@Programotion1
Aug 16 2016 03:51
on a phone its looks good but on a pc the pic is not centered
I cant find out how to center the picture
sean
@seananthony813
Aug 16 2016 03:52
@ndburrus i am new can u give me an example
Boris
@Boris1011
Aug 16 2016 03:52
@Programotion1 your link there doesn't work....!? for me anyway!?
Harshit Garg
@theharshitgarg
Aug 16 2016 03:52
@Programotion1 u can use <center> tag. place ur img in between <center></center>
Programotion1
@Programotion1
Aug 16 2016 03:52
weird it worked before
Norvin Burrus
@ndburrus
Aug 16 2016 03:53

@seananthony813 example of what?
basically, we're following the example code syntax/format, here:

<style>
  .larger-image {
    width: 500px;
  }
</style>

and we are also adding a class: like class="needed className" inside the/an element.

Boris
@Boris1011
Aug 16 2016 03:53
but yeah, what Harshit Garg said would work!! @Programotion1
ricky91210
@ricky91210
Aug 16 2016 03:53
how to prioritize one style over another
Programotion1
@Programotion1
Aug 16 2016 03:53
@theharshitgarg thanks
CamperBot
@camperbot
Aug 16 2016 03:53
programotion1 sends brownie points to @theharshitgarg :sparkles: :thumbsup: :sparkles:
:cookie: 372 | @theharshitgarg |http://www.freecodecamp.com/theharshitgarg
Harshit Garg
@theharshitgarg
Aug 16 2016 03:53
@ricky91210 u can use !important for forcefully implementing some style.
Programotion1
@Programotion1
Aug 16 2016 03:55
when i click on the link it works
@Boris1011 maybe you dont have access the real website
ricky91210
@ricky91210
Aug 16 2016 03:56
i have to create a css class called pink-text and nothing i do works
sean
@seananthony813
Aug 16 2016 03:56
@ndburrus
  • need the link - 1st code line
  • need .smaller-image & h2 elements within style tags
  • need font-family (Monospace), inside p element within style tag/s
  • the style tags (opening and closing) should contain 4 elements: .red-text, .smaller-image, h2, & p
  • need img tag (with class "smaller-image"), between h2 & 1st p tag
  • last p tag needs class ("red-text")
Programotion1
@Programotion1
Aug 16 2016 03:56
@Boris1011 does this link work?> https://en.wikipedia.org/wiki/Jesus
Agarza1921
@Agarza1921
Aug 16 2016 03:57

override class declarations with inline styles. need to over ride h1 color to white while keeping id and classes <style>
body {
background-color: black;
font-family: Monospace;
color: green;
}

orange-text {

color: orange;

}
.pink-text {
color: pink;
}
.blue-text {
color: blue;
}
<h1 style="color: white">
</style>

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

Boris
@Boris1011
Aug 16 2016 03:58
Yes... I do have access @Programotion1 .... I get into the codepen site and it says 404 can't find page
Norvin Burrus
@ndburrus
Aug 16 2016 03:58
@seananthony813 ok, lets, do this. i'll markup the code for you (with notes). that might be more efficient. give me a couple of minutes - im going to step away for a second...
chantaldesiree
@chantaldesiree
Aug 16 2016 03:58
Hi Guys, I'm having a bit of trouble aligning responsive thumbnails in my portfolio project.. Any chance someone might be able to tell me where I'm going wrong? I'd like to get rid of the space in between the top and bottom rows, also, when it's viewed on mobile, it creates about a 2% margin on the right hand side. http://codepen.io/chantaldesiree/pen/EKzqrB
Programotion1
@Programotion1
Aug 16 2016 03:59
i dont understand why it works on my pic and phone and note on yours
sean
@seananthony813
Aug 16 2016 03:59
@ndburrus ok thank u
CamperBot
@camperbot
Aug 16 2016 03:59
seananthony813 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1612 | @ndburrus |http://www.freecodecamp.com/ndburrus
Boris
@Boris1011
Aug 16 2016 03:59
@Programotion1 no idea!!! could you put up the link again... I'll see if it works... might have just been a bug!!
Boris
@Boris1011
Aug 16 2016 04:00
@Programotion1 now that worked!!!
Programotion1
@Programotion1
Aug 16 2016 04:00
oh good
thanks for your input
@Boris1011 thanks
CamperBot
@camperbot
Aug 16 2016 04:01
programotion1 sends brownie points to @boris1011 :sparkles: :thumbsup: :sparkles:
:cookie: 213 | @boris1011 |http://www.freecodecamp.com/boris1011
Boris
@Boris1011
Aug 16 2016 04:02
:+1: One thing that would be cool is that where you have the short statements, is if the first letter of each line would spell something out!!! if that makes sense!! @Programotion1
Matt
@mjarmand25
Aug 16 2016 04:25

please help : "First, create a h1 element with the text Hello World

Then, let's give all elements on your page the color of green by adding color: green; to your body element's style declaration.

Finally, give your body element the font-family of Monospace by adding font-family: Monospace; to your body element's style declaration.

<h1>hello world</h1>
<style>
  body {
    background-color: green;
  }

</style>
Malcolm
@holdenator55
Aug 16 2016 04:26
Did you forget to put in the Monospace part? @mjarmand25
Agarza1921
@Agarza1921
Aug 16 2016 04:28
<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. ">
<img class=img-responsive src=https://bit.ly/fcc-running-cats </a> does anyone see anything wrong with this code? it keeps saying my new img element doesnt have a closing angle bracket
Malcolm
@holdenator55
Aug 16 2016 04:29
insert > right after "running-cats"
Idk let me know if that helped @Agarza1921
Agarza1921
@Agarza1921
Aug 16 2016 04:30
yep that worked thanks @holdenator55
CamperBot
@camperbot
Aug 16 2016 04:30
agarza1921 sends brownie points to @holdenator55 :sparkles: :thumbsup: :sparkles:
:cookie: 32 | @holdenator55 |http://www.freecodecamp.com/holdenator55
Agarza1921
@Agarza1921
Aug 16 2016 04:30
something so small screws up everything lol
Norvin Burrus
@ndburrus
Aug 16 2016 04:33
@seananthony813 :sparkles:
see comments
Humoyun
@Humoyun
Aug 16 2016 04:33
This message was deleted
CamperBot
@camperbot
Aug 16 2016 04:33
no wiki entry for: i just came to my first projects section of front end development there are instructions for 2 project eg build tribute page my question is the interface should be the same or it can be different
Humoyun
@Humoyun
Aug 16 2016 04:34
I just came to my first projects section of Front End Development, there are instructions for 2 project, e.g. Build Tribute Page. My question is the interface should be the same, or it can be different?
Robert Richey
@0x0936
Aug 16 2016 04:36
@Humoyun the only rules are to fulfill the user stories. How you do that is up to you.
Agarza1921
@Agarza1921
Aug 16 2016 04:38

okay super lost again lol, adding a boostrap button to an image <a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>

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

it needs to go under the second image
Stee
@5t33
Aug 16 2016 04:39
I can't seem to set 3 elements to go in like with the row class...
in line*
in the same row...
May
@xSpideyx
Aug 16 2016 04:39
ugghhhhh! I cant figure out whats wrong with my "home" and "contact" links can somebody helphttps://codepen.io/Spidey/pen/akRaBr
Stee
@5t33
Aug 16 2016 04:40
maybe try btn and btn-md instead
well
you also need it to be a button element
not a unordered list
That's an odd way to do it
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 04:42
hi quick question
why is this deadlink not working
Stee
@5t33
Aug 16 2016 04:42
@xSpideyx
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 04:43
<a herf="#" > <img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> </a>
Malcolm
@holdenator55
Aug 16 2016 04:43
"Nest your text field in a form element. Add the action="/submit-cat-photo" attribute to this form element."
MY CODE:

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

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

What do I do?
Wait nvm
i think i got it
Agarza1921
@Agarza1921
Aug 16 2016 04:43
<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>
@rostyslavsagadyn
Robert Richey
@0x0936
Aug 16 2016 04:43
@5t33 rows contain columns. Bootstrap uses a 12-column grid system. If you want 3 elements in their own column, all in the same row, something like this:
<div class="row">
  <div class="col-md-4"><button>Button 1</button></div>
  <div class="col-md-4"><button>Button 2</button></div>
  <div class="col-md-4"><button>Button 3</button></div>
</div>
Ben
@BenMatare
Aug 16 2016 04:44
Hey there, quick question how do I override my body color with the color of the class?
Agarza1921
@Agarza1921
Aug 16 2016 04:44

Bootstrap has its own styles for button elements, which look much better than the plain HTML ones.

Create a new button element below your large kitten photo. Give it the class btn and the text of "Like".

thats the instructions ive been given
sean
@seananthony813
Aug 16 2016 04:45
@ndburrus u are awesome thank u
CamperBot
@camperbot
Aug 16 2016 04:45
seananthony813 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:warning: seananthony813 already gave ndburrus points
Stee
@5t33
Aug 16 2016 04:45

@0x0936

<div class = "container">

  <div class ="row">

    <div class = "condition col-sm-4"> 
      condition 
    </div>

    <div class = "icon col-sm-4">
      <i> icon will go here </i> 
    </div>

    <div class = "icon col-sm-4">
      <button class="btn btn-primary" id = "temp">
        F&deg
      </button>
    </div>

  </div>

This is what I have....

seems pretty simple right? lol
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 04:46
it still says its wrong
Agarza1921
@Agarza1921
Aug 16 2016 04:46
@rostyslavsagadyn did you put <p>Click here for <a href="#">cat photos</a>.</p> this above it?
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 04:47
no thank you
Darshan
@Dave1089
Aug 16 2016 04:47
@BenMatare assign color to that class, simple!
May
@xSpideyx
Aug 16 2016 04:47
@5t33 I tried that already but the buttons didn't end up working as links either\
Agarza1921
@Agarza1921
Aug 16 2016 04:47
yep no problem
Stee
@5t33
Aug 16 2016 04:47
@rostyslavsagadyn just replace the hashtag with the link. I think that's what it is but I can't remember 100%
Robert Richey
@0x0936
Aug 16 2016 04:47
@5t33 besides missing a closing div for container, that's structurally correct Bootstrap. The problem may be in the styles applied to those other classes which you've grouped to the columns. I recommend moving those custom classes as nested elements within the columns
Ben
@BenMatare
Aug 16 2016 04:48
@Dave1089 I thought I did; h1 .pink-tect{color: pink;} unless I am doing something wrong with my h1 within my style?
Darshan
@Dave1089
Aug 16 2016 04:48
pink-tect?
Stee
@5t33
Aug 16 2016 04:48
@0x0936 I missed the closing div while copying
Malcolm
@holdenator55
Aug 16 2016 04:48
How do I upload a picture of my code?
LIke you guys are doing?
Robert Richey
@0x0936
Aug 16 2016 04:49
@5t33 got a project link?
Stee
@5t33
Aug 16 2016 04:50
sure
Darshan
@Dave1089
Aug 16 2016 04:50
@BenMatare only use .pink-text remove h1 because u r going to assign that class to h1 anyways in html like <h1 class="pink-text">....</h1>
oops....
well I feel dumb
wasn't zooming out enough XD
Robert Richey
@0x0936
Aug 16 2016 04:50
:)
Stee
@5t33
Aug 16 2016 04:51
lol thanks
thanks @0x0936
CamperBot
@camperbot
Aug 16 2016 04:51
5t33 sends brownie points to @0x0936 :sparkles: :thumbsup: :sparkles:
:star2: 1659 | @0x0936 |http://www.freecodecamp.com/0x0936
Ben
@BenMatare
Aug 16 2016 04:52
@Dave1089 Okay, I'm not really following.. how do I asking the class to the h1 element then? I just did a new line of <h1 class="pink-text"></h1> and then specified it in my style?
Chris Cullen
@123xylem
Aug 16 2016 04:52
for(j=1;j<arr.length;j++){
    arr[j]+=arr[j-1];        console.log(arr[j], arr[j-1]);
}if(arr[j]==7){return "done";}
else return 'd';
The console.log shows 7 but it still doesnt execute the if statement! How come??!
Ben
@BenMatare
Aug 16 2016 04:53
@Dave1089 Meant to say assign*
rostyslav sagadyn
@rostyslavsagadyn
Aug 16 2016 04:53
ok one more time the a link fort the image is not working for some reason even when i copied your code exactly
so here is my entire page where is my mistake

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

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

h2 {
font-family: Lobster, Monospace;
}

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

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

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

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

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

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

Chris Cullen
@123xylem
Aug 16 2016 04:54
help pairwise
CamperBot
@camperbot
Aug 16 2016 04:54

:point_right: algorithm pairwise [wiki]

Algorithm Pairwise

:triangular_flag_on_post: Remember to use Read-Search-Ask if you get stuck. Try to pair program :busts_in_silhouette: and write your own code :pencil:

:checkered_flag: Problem Explanation:

The program should look for pairs of numbers in the array whose sum equal the second argument arg. Then instead of adding those numbers up, their indices are to be added.

Remember that arrays start at index 0 and go from there so from [1,4,2,3,0,5] if we switch to their indices it would be [0,1,2,3,4,5]. Then, we add indices 1 + 2 + 3 + 5 and we get 11. That is what we need to return.

Relevant Links

:pencil: read more about algorithm pairwise on the FCC Wiki

Kirstie Mack
@firstcreatedbydesign
Aug 16 2016 04:54
Quick question; What does it mean when it says: Make sure each of your p elements has a closing tag.
Robert Richey
@0x0936
Aug 16 2016 04:54
@123xylem that if statement is outside the loop where j will be equal to arr.length.
Malcolm
@holdenator55
Aug 16 2016 04:55
It means that make sure at the end of your p element, it says </p>
Kirstie Mack
@firstcreatedbydesign
Aug 16 2016 04:55

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

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

<p1>class.red-t<style>
h2{
color: red;
}
</style>

<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.ss sniff.</p>

Malcolm
@holdenator55
Aug 16 2016 04:55
@firstcreatedbydesign ^^^
Kirstie Mack
@firstcreatedbydesign
Aug 16 2016 04:55
It does. But for some reason, it isn't taking it.
Malcolm
@holdenator55
Aug 16 2016 04:55
That's weird.
Coy Sanders
@coymeetsworld
Aug 16 2016 04:56
you should only have one set of style tags @firstcreatedbydesign
also there's no p1 tag, its just p
Kirstie Mack
@firstcreatedbydesign
Aug 16 2016 04:56
Ok. Thank you.
Coy Sanders
@coymeetsworld
Aug 16 2016 04:56
np
Kirstie Mack
@firstcreatedbydesign
Aug 16 2016 04:57
@CorySanders
Norvin Burrus
@ndburrus
Aug 16 2016 04:57
@seananthony813 you're very welcome! sorry for the delay - it's going to be a late one.... enjoy! :palm_tree:
Bill
@orangechicken1
Aug 16 2016 04:57
Hey can anyone help me with this?
"Inherit Styles from the Body Element"
Give your body element the font-family property of Monospace.
is the error I' mrecieving

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


}

h1 {
font-family: Monospace;

}

</style>

<body>

<h1>
Hello World
</h1>

oops
Manish Giri
@Manish-Giri
Aug 16 2016 04:59
@orangechicken1 do you know what you need to do?
Norvin Burrus
@ndburrus
Aug 16 2016 05:00
@rostyslavsagadyn :sparkles:
  • this: font-family: Monospace; should be inside body, within the style tag/s
  • remove h1 from the style tag/s
Boris
@Boris1011
Aug 16 2016 05:00
hello world again
CamperBot
@camperbot
Aug 16 2016 05:00

welcome to FreeCodeCamp @Boris1011!

Norvin Burrus
@ndburrus
Aug 16 2016 05:01
@Boris1011
Welcome to fcc!!
Explore, enjoy, learn, and happy coding! :sparkles:
Malcolm
@holdenator55
Aug 16 2016 05:01
I'm logging off everyone. Good luck!
Norvin Burrus
@ndburrus
Aug 16 2016 05:03
@orangechicken1 is it resolved?
Stee
@5t33
Aug 16 2016 05:04
any idea why my row wont center?
sean
@seananthony813
Aug 16 2016 05:04
@ndburrus That's alright I have 6 months of unemployment I will be studying 8 to 12 hours a day for the next year I want to be best I can possibly be I want a future a real future I make a good living
Stee
@5t33
Aug 16 2016 05:05
The elements are only on top of one another because they're actually all the way to the left if you make the screen wide enough
Coy Sanders
@coymeetsworld
Aug 16 2016 05:05
style = "center"> that's not a style @5t33
Stee
@5t33
Aug 16 2016 05:05
yeah
I was just trying anything
sean
@seananthony813
Aug 16 2016 05:05
@ndburrus How long have you been doing coding
Stee
@5t33
Aug 16 2016 05:06
doesn't make a difference
Coy Sanders
@coymeetsworld
Aug 16 2016 05:06
to align text you need to use the text-align property
Boris
@Boris1011
Aug 16 2016 05:06
@5t33 where you have the row style element thingo.... try putting a . in front of row, so
.row {text-align:center;}
Stee
@5t33
Aug 16 2016 05:07
http://codepen.io/5t33/pen/bZzXEX?editors=1101 yeah... didn't work... the condition class is already doing that
@Boris1011 @coymeetsworld any ideas? :/
Boris
@Boris1011
Aug 16 2016 05:10
not really.... I think between the .container and .row, you would only need 1 text-align:center; I don't know if that would make any difference, but......
sean
@seananthony813
Aug 16 2016 05:12
@ndburrus. No I have not but I will read anything u think would help me you have a gift to explain in layman terms what these these things mean
Stee
@5t33
Aug 16 2016 05:13
so messing around
I made the widths of each element larger
and now they're in line...
Norvin Burrus
@ndburrus
Aug 16 2016 05:14
@seananthony813 keep in touch... there is a ton of information out there... have 2 basic algos to finish then intermediate projects... fun, fun, fun... oh, and lots of reading (and practice) to do...
Robert Richey
@0x0936
Aug 16 2016 05:14
@5t33 is this what you're trying to do?
Stee
@5t33
Aug 16 2016 05:15
yes
and then I'm trying to get that to the centermove that to the cent
sean
@seananthony813
Aug 16 2016 05:15
@ndburrus
DethSonik
@DethSonik
Aug 16 2016 05:17
Hi i need help with changing the font size of an element. Not sure where I'm going wrong. Thanks!
sean
@seananthony813
Aug 16 2016 05:17
@ndburrus ok I will thank you for your help I'm going to log off I am tired
CamperBot
@camperbot
Aug 16 2016 05:17
seananthony813 sends brownie points to @ndburrus :sparkles: :thumbsup: :sparkles:
:star2: 1613 | @ndburrus |http://www.freecodecamp.com/ndburrus
Stee
@5t33
Aug 16 2016 05:18
@0x0936 You're ability to make that look easy is admirable
Boris
@Boris1011
Aug 16 2016 05:18
@DethSonik what challenge are you doing???? And what do you have for your code???
DethSonik
@DethSonik
Aug 16 2016 05:18

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

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

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

<p>Kitty ipsum dolor sit amet, purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Boris
@Boris1011
Aug 16 2016 05:21
@DethSonik <p> elements are not numbered... so then if you take out the 1 in both the style element and where you have <p1.....> you should be good
DethSonik
@DethSonik
Aug 16 2016 05:21
@Boris1011 Thanks I'll give that a shot!
CamperBot
@camperbot
Aug 16 2016 05:21
dethsonik sends brownie points to @boris1011 :sparkles: :thumbsup: :sparkles:
:cookie: 214 | @boris1011 |http://www.freecodecamp.com/boris1011
Boris
@Boris1011
Aug 16 2016 05:22
Anytime @DethSonik !!! :+1:
DethSonik
@DethSonik
Aug 16 2016 05:23
Totally worked! thx :D
Boris
@Boris1011
Aug 16 2016 05:23
:+1: coolo!!! :smile:
Robert Richey
@0x0936
Aug 16 2016 05:25
@5t33 here's another way of doing the same thing without flexbox
Boris
@Boris1011
Aug 16 2016 05:32
how does one "add a thumbnail of the project" for the portfolio page???
is it just a screenshot or something different??
Mej89
@Mej89
Aug 16 2016 05:33
anyone available to help me with 'sizing images'
?
Boris
@Boris1011
Aug 16 2016 05:34
yea go for it!!!!
Mej89
@Mej89
Aug 16 2016 05:34

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

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

h2 {
font-family: Lobster, Monospace;
}

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

</style>

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

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

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

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

I'm trying to add

.smaller-image {
width: 100px;
}

Boris
@Boris1011
Aug 16 2016 05:36
so you will need a .smaller-image{ width: 100px;} in the style element and then in the <img> element, add a class="smaller-image", so <img class="smaller-image" etc.>
Mej89
@Mej89
Aug 16 2016 05:37
ohh I see
let me try
Mostafa Syam
@pro-mos
Aug 16 2016 05:38
@Boris1011 mostly screenshot images
Boris
@Boris1011
Aug 16 2016 05:39
Ah, cool thanks @pro-mos !!!
CamperBot
@camperbot
Aug 16 2016 05:39
boris1011 sends brownie points to @pro-mos :sparkles: :thumbsup: :sparkles:
:cookie: 301 | @pro-mos |http://www.freecodecamp.com/pro-mos
Mej89
@Mej89
Aug 16 2016 05:40
@Boris1011 thanks! It works. I was confused since the <img> only has two angle brackets as opposed to (<p>xyz</p>) having four angle brackets
CamperBot
@camperbot
Aug 16 2016 05:40
mej89 sends brownie points to @boris1011 :sparkles: :thumbsup: :sparkles:
:cookie: 215 | @boris1011 |http://www.freecodecamp.com/boris1011
Mostafa Syam
@pro-mos
Aug 16 2016 05:41
@Mej89 <img> is self closing tag, there's few more as well
Boris
@Boris1011
Aug 16 2016 05:41
All good mate!! And yeah ^
gitwithova
@gitwithova
Aug 16 2016 05:42
Piss! Can I get someone kind body to turn drain this for me? It needs to be blue " <h2 style="color:blue" "
Boris
@Boris1011
Aug 16 2016 05:42
@gitwithova challenge name???
friscodisco
@friscodisco
Aug 16 2016 05:43
@gitwithova space between the : and blue so like this color:'space'blue;
gitwithova
@gitwithova
Aug 16 2016 05:43
@friscodisco thanks
CamperBot
@camperbot
Aug 16 2016 05:43
gitwithova sends brownie points to @friscodisco :sparkles: :thumbsup: :sparkles:
:cookie: 275 | @friscodisco |http://www.freecodecamp.com/friscodisco
gitwithova
@gitwithova
Aug 16 2016 05:44
let me try it out
Chaf
@snorlax55
Aug 16 2016 05:46
Hi guys I need help
gitwithova
@gitwithova
Aug 16 2016 05:46
@friscodisco yea still not working
friscodisco
@friscodisco
Aug 16 2016 05:47
@gitwithova close your h2 tag
luis4flames
@luis4flames
Aug 16 2016 05:47

```
function lookUpProfile(firstName, prop){
// Only change code below this line

var result;
var i = 0;
while ( i < contacts.length) {
if ( contacts[i].firstName !== firstName) {
result = "No such contact";
i++;
} else {
if ( contacts[i].hasOwnProperty(prop) === false ){
result = "No such property";
}
else {
result = contacts[i][prop];
}
i++;
}
}

return result;
// Only change code above this line
}
``` Can anyone see why this would find one nape in a JSON but not another if it isnt a spelling error

function lookUpProfile(firstName, prop){
// Only change code below this line

  var result;
  var i = 0;
  while ( i < contacts.length) {
    if ( contacts[i].firstName !== firstName) {
      result = "No such contact";
      i++;
    } else {
      if ( contacts[i].hasOwnProperty(prop) === false ){
        result = "No such property";
      }
      else {
        result = contacts[i][prop];
      }
      i++;
    }
  }

  return result;
// Only change code above this line
}
gitwithova
@gitwithova
Aug 16 2016 05:48
@friscodisco they all are
friscodisco
@friscodisco
Aug 16 2016 05:52
@gitwithova do you have this
<style>
  h2 {
       color: blue;
     }
</style>
Deklirk
@Deklirk
Aug 16 2016 05:54
Hi am Deklirk, Have a cordova problem using polymer
Mej89
@Mej89
Aug 16 2016 05:56
@pro-mos thanks ya basha
CamperBot
@camperbot
Aug 16 2016 05:56
mej89 sends brownie points to @pro-mos :sparkles: :thumbsup: :sparkles:
:cookie: 302 | @pro-mos |http://www.freecodecamp.com/pro-mos
Mostafa Syam
@pro-mos
Aug 16 2016 05:57
:)
TylersCode
@TylersCode
Aug 16 2016 06:04
I'm having trouble with this jQuery challenge
Michael Bomholt
@bomholtm
Aug 16 2016 06:05
@TylersCode which one
TylersCode
@TylersCode
Aug 16 2016 06:06

Target the same element with multiple jQuery Selectors

Now you know three ways of targeting elements: by type: $("button"), by class: $(".btn"), and by id $("#target1").

Although it is possible to add multiple classes in a single .addClass() call, let's add them to the same element in three separate ways.

Using .addClass(), add only one class at a time to the same element, three different ways:

Add the animated class to all elements with type button.

Add the shake class to all the buttons with class .btn.

Add the btn-primary class to the button with id #target1.

Note
You should only be targeting one element and adding only one class at a time. Altogether, your three individual selectors will end up adding the three classes shake, animated, and btn-primary to #target1.

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

});
</script>
Michael Bomholt
@bomholtm
Aug 16 2016 06:07
just post the link next time :)
DJ
@qualitymanifest
Aug 16 2016 06:07
@TylersCode addClass not addclass
TylersCode
@TylersCode
Aug 16 2016 06:08
Sorry this is my first time using this chat.
Michael Bomholt
@bomholtm
Aug 16 2016 06:08
@TylersCode no problem :) your link will contain the code you wrote so its way easier to help
TylersCode
@TylersCode
Aug 16 2016 06:08
O geez, something sooo simple. I must be tired. Thanks for the help
Michael Bomholt
@bomholtm
Aug 16 2016 06:09
and yea its addClass =)
TylersCode
@TylersCode
Aug 16 2016 06:09
Awesome I'll do that next time
DJ
@qualitymanifest
Aug 16 2016 06:09
@TylersCode no worries. it's not a strict rule to paste the link - but in this case it would be shorter than pasting everything
TylersCode
@TylersCode
Aug 16 2016 06:10
That was it. Thanks again. Off to bed now.
Meagan Harris
@meamay07
Aug 16 2016 06:22
how do i resize images
Henry Cabello
@hacu9
Aug 16 2016 06:22
Wheres the "well" supposed to go?
<div class="container-fluid">
<h3 class="text-primary text-center">jQuery Playground</h3>
<div class="row">
<div class="col-xs-6 well">

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

</div>
</div>
</div>
nvm
Chris Cullen
@123xylem
Aug 16 2016 06:29
function pairwise(arr, arg) {
 // Set sum of indices to zero
 var sum = 0;
 // make a local copy of the arguments object so we don't modify it directly
 var pairArr = arr.slice();
 // looping from first element
 for(i = 0; i < pairArr.length; i++) {
   //Looping from second element by setting first element  constant
   for(j = i + 1; j < pairArr.length; j++) {
     // Check whether the sum is equal to arg
     if(pairArr[i] + pairArr[j] == arg) {
       //Add the indices
       sum += i + j;console.log(pairArr[i]);
       //Set the indices to NaN so that they can't be used in next iteration
       pairArr[i] = pairArr[j] = NaN;

     }
   }
 }
 return sum;
}

// test here
pairwise([1,4,2,3,0,5], 7);
Can someone tell me where here the INDEX number is taken and not the element value??
when it says sum += i +j isnt that the value of i and j rather than the index of I and j?
Harley A.
@harley91146
Aug 16 2016 06:35
Hi, complete noob here. On the first project, "Build a Tribute Page", there is a grey box that all the contents of the page is in. How do I make that box? I even broke the cardinal rule and looked at the source and can't seem to find it. Thanks.
Darren
@DarrenfJ
Aug 16 2016 06:36
@harley91146 it's a bootstrap thing...
it's a class
Neak
@WayToGn
Aug 16 2016 06:38
hey guys
Harley A.
@harley91146
Aug 16 2016 06:38
Ok, I had a feeling. But I don't see any actual reference in it to the code. I know I could make a class with background color but they didn't seem to do that. I wanted to know if I was missing some more efficient way.
Darren
@DarrenfJ
Aug 16 2016 06:38
I think it's the 'jumotron' class
@harley91146 if you link to the bootstrap material, it's like adding a ton of CSS to your site and you have classes you can call without having to create them...
Harley A.
@harley91146
Aug 16 2016 06:40
@DarrenfJ I could have sworn I did that. I'll check again.
gitwithova
@gitwithova
Aug 16 2016 06:41
Quick tip

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

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

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

Darren
@DarrenfJ
Aug 16 2016 06:41
@harley91146 you using codepen? gto the CSS in the setting and have bootstrap utomatically added..
Harley A.
@harley91146
Aug 16 2016 06:41
I'm using codepen, and used quickadd for bootstrap. Should work, yes?
gitwithova
@gitwithova
Aug 16 2016 06:41
I need help getting the p elements to the right size
16px
friscodisco
@friscodisco
Aug 16 2016 06:42
@123xylem you are correct it is the value because sum += i +j is in fact sum = sum + sum + i + j
gitwithova
@gitwithova
Aug 16 2016 06:42
any help would be highly appreciated and esteemed!
Darren
@DarrenfJ
Aug 16 2016 06:42
then surround whatever you want in the grey in a set of <div></div> with class="jumbotron"
friscodisco
@friscodisco
Aug 16 2016 06:42
@gitwithova you missed the space again?
Darren
@DarrenfJ
Aug 16 2016 06:43
@gitwithova i can;t remember but I think in the exercise they just wanted you to add the 16 px to the CSS for a p element
and they give an example like using h2 or something for formatting
Harley A.
@harley91146
Aug 16 2016 06:44
@DarrenfJ Ok, bootstrap is loaded, and this is something I did. http://i.imgur.com/WzggZjJ.png
Darren
@DarrenfJ
Aug 16 2016 06:45
like if I wanted to change h2 to 32px I wojuld add in the CSS part (the part between the style tags)
h2 { font-size:32px; }
something like that.. but for p instead of h2... @gitwithova
Chris Cullen
@123xylem
Aug 16 2016 06:45
@friscodisco but why isnt sum the sum of the value rather than the sum of the index numbers?
\
Harley A.
@harley91146
Aug 16 2016 06:45
Nevermind, apparently it's lowercase.. I'm a tard. Ok, next thing. Is there a reference to all the available assets in bootstrap?
Darren
@DarrenfJ
Aug 16 2016 06:45
small j jumobtron
@harley91146 i just went in and removed it and lost the grey
friscodisco
@friscodisco
Aug 16 2016 06:46
@123xylem it is the sum of the value
Victor
@victicdin
Aug 16 2016 06:47
@DarrenfJ You're the only person I recognize here atm so I'd like to share my Tribute page with you. Because reasons and I'm tired. Dinky first project but it's mine. https://victicdin.github.io/
Harley A.
@harley91146
Aug 16 2016 06:48
@DarrenfJ Is there a god reference to all the assets in bootstrap, i.e. how would I know about jumbotron without cheating?
Victor
@victicdin
Aug 16 2016 06:48
No clue if you remember me btw. Also hi.
Darren
@DarrenfJ
Aug 16 2016 06:48
@harley91146 there's no cheating in googling a framework to understand it
@victicdin hey buddy! :wave:
Harley A.
@harley91146
Aug 16 2016 06:49
@DarrenfJ Haha I cheated because I looked at the source when they said not to.
Darren
@DarrenfJ
Aug 16 2016 06:49
@harley91146 ahhh.. yah I wouldn't worry too much about that ;)
@victicdin hey what did you use to get the box within a box? Just curious
Victor
@victicdin
Aug 16 2016 06:51
@harley91146 I found out about the jumbotron class from seeing the source in the video. I read the docs before I used it, I don't think I cheated.
@DarrenfJ It's just a plain old boostrap well.
Darren
@DarrenfJ
Aug 16 2016 06:51
@victicdin looks nice man
Harley A.
@harley91146
Aug 16 2016 06:51
@victicdin @DarrenfJ Well maybe I'm just being too hard on myself. Web is a new animal to me. Thanks for the help.
Darren
@DarrenfJ
Aug 16 2016 06:52
@harley91146 stackoverflow is your fiend ;)
Harley A.
@harley91146
Aug 16 2016 06:52
@DarrenfJ Is that something simple enough to google or should I ask for a tl;dr?
Victor
@victicdin
Aug 16 2016 06:52
@DarrenfJ Check the source btw. I just realized I left my comments in when I commited it. I enjoy finding them in other people's work so you might be amused.
Friggin roman numerals
I spent a good hour trying to figure out which CSS classes let me do clipping or masking for an image because that dude's portrait was huge. I later realized I could just edit the image. >.<
umer khan
@umerk6403
Aug 16 2016 06:54
hi
Darren
@DarrenfJ
Aug 16 2016 06:54
@victicdin so yer a roman numeralist ;)
@harley91146 stackoverfow?
Victor
@victicdin
Aug 16 2016 06:54
@DarrenfJ Seeing a clock face with IIII on it infuriates me, yes.
dlhill615
@dlhill615
Aug 16 2016 06:55
Finding a Remainder in JavaScript
Darren
@DarrenfJ
Aug 16 2016 06:55
big website of many questions and answers originally about coding but now about pretty much everything
dlhill615
@dlhill615
Aug 16 2016 06:55
So confused
Darren
@DarrenfJ
Aug 16 2016 06:55
@victicdin that was really a thing?
Harley A.
@harley91146
Aug 16 2016 06:55
@DarrenfJ yeah I see it's a website. Seems like a lot of it is way over my head.
Victor
@victicdin
Aug 16 2016 06:56
@DarrenfJ I personally demolished a giant fail clock on my last move because it was too big and clunky. It had IX but no IV. just IIII.
Darren
@DarrenfJ
Aug 16 2016 06:56
@harley91146 when you start googling for coding solutions it comes up all the time
@victicdin sooo weird
dlhill615
@dlhill615
Aug 16 2016 06:56
Finding a Remainder in JavaScript
Paul
@paulkiio
Aug 16 2016 06:57
hello all, I am having trouble distinguishing between "class selectors" & "class declarations" can someone explain this to me..I know one uses a period and the other uses an opening tag but when is it appropriate to use either ?
Harley A.
@harley91146
Aug 16 2016 06:57
@DarrenfJ Disregard that last message, I started typing that before you answered. Thanks for the tips. I'll keep sof in mind.
CamperBot
@camperbot
Aug 16 2016 06:57
harley91146 sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:cookie: 711 | @darrenfj |http://www.freecodecamp.com/darrenfj
Victor
@victicdin
Aug 16 2016 06:57
I pity the next generation of students that need to use references. High level text books will be the only place they see them any more.
Harley A.
@harley91146
Aug 16 2016 06:57
How did I send brownie points?
DJ
@qualitymanifest
Aug 16 2016 06:58

@DarrenfJ

big website of many questions and answers originally about coding but now about pretty much everything

have you seen XKCD's "thing explainer"??

Darren
@DarrenfJ
Aug 16 2016 06:58
@harley91146 you thanked me using my @name
Darren
@DarrenfJ
Aug 16 2016 06:59
@qualitymanifest that's a book isn't it? I saw one he did for a rocket ship hat was pretty cool
Harley A.
@harley91146
Aug 16 2016 06:59
@DarrenfJ Ahh, gotcha. Ok, back to work. Take care.
Darren
@DarrenfJ
Aug 16 2016 06:59
@harley91146 code on brutha!
DJ
@qualitymanifest
Aug 16 2016 07:00
@DarrenfJ yeah i think you're talking about "up goer five". "thing explainer" is kind of like up goer five but covers more ground haha
Victor
@victicdin
Aug 16 2016 07:00
I'm off to bed. Night @DarrenfJ
take care
Darren
@DarrenfJ
Aug 16 2016 07:01
@victicdin night Victor!
dlhill615
@dlhill615
Aug 16 2016 07:01
Finding a remainder in JavaScript confused. Anyone willing to break it down in slow learner terms
Darren
@DarrenfJ
Aug 16 2016 07:01
@qualitymanifest yah i thought it was a book of everything in the known universe.. ;)
Sumit Kumar
@spark25
Aug 16 2016 07:02
inside of me a fire breathes
DJ
@qualitymanifest
Aug 16 2016 07:04
@dlhill615 do you understand what a remainder is in mathematic division?
Paul
@paulkiio
Aug 16 2016 07:05
that helped @friscodisco , thanks
CamperBot
@camperbot
Aug 16 2016 07:05
jshotkid sends brownie points to @friscodisco :sparkles: :thumbsup: :sparkles:
:cookie: 276 | @friscodisco |http://www.freecodecamp.com/friscodisco
dlhill615
@dlhill615
Aug 16 2016 07:06
@anyone
Finding a remainder in JavaScript confused. Anyone willing to break it down in slow learner terms
Xiao Yang
@xiaopow
Aug 16 2016 07:07
Ask us programming questions on www.codeforx.com and we will answer asap
@dlhill615 ask us on www.codeforx.com
DJ
@qualitymanifest
Aug 16 2016 07:08
@dlhill615 yes, i just responded to you. do you understand what a remainder is in math division?
dlhill615
@dlhill615
Aug 16 2016 07:08
Of course
DJ
@qualitymanifest
Aug 16 2016 07:08
@dlhill615 okay, so what is the remainder of 10 / 4?
Darren
@DarrenfJ
Aug 16 2016 07:08
oh man i am sleepy and just realizing it now... will hafta go sneak off to sleepytimes.. later roomies..
dlhill615
@dlhill615
Aug 16 2016 07:08
A2
2
DJ
@qualitymanifest
Aug 16 2016 07:10
@dlhill615 correct. check this out https://repl.it/Cn5g and hit the "run" button
the modulo % symbol gives you the remainder of dividing
dlhill615
@dlhill615
Aug 16 2016 07:11
I clearly understand math. Just not clear on the code or challenge. Info is vague, imho
DJ
@qualitymanifest
Aug 16 2016 07:13

@dlhill615 yes, you do. since i didn't know you i had to ask. the expectations are very clear:

Set remainder equal to the remainder of 11 divided by 3 using the remainder (%) operator.

i gave you a link showing you how to use the modulo operator to get the remainder
Chris Cullen
@123xylem
Aug 16 2016 07:15
Well I finished pairwise but I had to look at the answer and basically once I understood it I copied it...
Is that cheating?
Sumit Kumar
@spark25
Aug 16 2016 07:16
@123xylem no thats shortcut...its not harmful if you are confident enough.
dlhill615
@dlhill615
Aug 16 2016 07:19
Have you even looked at the challenge @qualitymanifest I appreciate ur guidance. But I am still not understanding y I am not clearing the challenge
DJ
@qualitymanifest
Aug 16 2016 07:19
@dlhill615 yes i have done that challenge and i looked at it to remember what it requires. paste your code.
Mrsmao
@whb123
Aug 16 2016 07:20
why i dont have the result
<h1 id="orange-text" class="pink-text blue-text" color:white >Hello World!</h1>
DJ
@qualitymanifest
Aug 16 2016 07:23
@dlhill615 besides, it should be clear to you that i looked at the challenge, since i already pasted the instructions to you:

Set remainder equal to the remainder of 11 divided by 3 using the remainder (%) operator.

Sumit Kumar
@spark25
Aug 16 2016 07:24
@whb123 u have to use <style> tag to do inline styling
modify yr code in his way <h1 id="orange-text" class="pink-text blue-text" style="color:white" >Hello World!</h1>
axel8591
@axel8591
Aug 16 2016 07:25
@whb123 Why do you get an id and a class inside same tag?
dlhill615
@dlhill615
Aug 16 2016 07:25
11 % 3 = 2 because
Math.floor(11 / 3) = 2
3 * 3 = 9
11 - 9 = 3
Confused as....
Sumit Kumar
@spark25
Aug 16 2016 07:26
@axel8591 its a challenge to show the precedence of diffrent ways in which styling can be done
axel8591
@axel8591
Aug 16 2016 07:26
@spark25 ok
DJ
@qualitymanifest
Aug 16 2016 07:26
@dlhill615 Math.floor() is unnecessary. still, you aren't assigning anything to remainder.
axel8591
@axel8591
Aug 16 2016 07:27
@spark25 Your color needs a style I mean.
dlhill615
@dlhill615
Aug 16 2016 07:28
Simply not getting it
axel8591
@axel8591
Aug 16 2016 07:29
@dlhill615 11 - 9 = 3 Are you sure?
Mrsmao
@whb123
Aug 16 2016 07:29
@spark25 thanks
CamperBot
@camperbot
Aug 16 2016 07:29
whb123 sends brownie points to @spark25 :sparkles: :thumbsup: :sparkles:
:cookie: 66 | @spark25 |http://www.freecodecamp.com/spark25
chinandodo
@chinandodo
Aug 16 2016 07:30
I just finished my Random Quote Machine, all good, except when I tried to share here the link (I can't see the quote)
http://codepen.io/chinandodo/pen/KrEwxa
DJ
@qualitymanifest
Aug 16 2016 07:30
@dlhill615 var assignSomethingToThisVerySpecificVariable = that math
and yes 11-9 is not equal to 3 but i'm not even trying to address that right now
chinandodo
@chinandodo
Aug 16 2016 07:31
any idea?
dlhill615
@dlhill615
Aug 16 2016 07:31
var remainder = a % b
Paul
@paulkiio
Aug 16 2016 07:32
I am having trouble on "Override styles in subsequent CSS" Its asking me to put both blue text and pink text in my h1 element, what am I doing wrong?
DJ
@qualitymanifest
Aug 16 2016 07:32
@chinandodo don't worry about it
Paul
@paulkiio
Aug 16 2016 07:32

<style>
  body {
    background-color: black;
    font-family: Monospace;
    color: green;
  }
  .pink-text {
    color: pink;
  }
  .blue-text {
    color: blue;
  }
</style>
<h1 class="pink-text" "blue-text">Hello World!</h1>
Sumit Kumar
@spark25
Aug 16 2016 07:33
@jshotkid u don't need to put diffrent classses in different " "
DJ
@qualitymanifest
Aug 16 2016 07:33
@dlhill615 what is a? what is b? just do the math they ask and assign it to var remainder
Paul
@paulkiio
Aug 16 2016 07:33
uh huh ! :clap:
Sumit Kumar
@spark25
Aug 16 2016 07:34

@jshotkid do this

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

Paul
@paulkiio
Aug 16 2016 07:34
thanks @spark25
CamperBot
@camperbot
Aug 16 2016 07:34
jshotkid sends brownie points to @spark25 :sparkles: :thumbsup: :sparkles:
:cookie: 67 | @spark25 |http://www.freecodecamp.com/spark25
axel8591
@axel8591
Aug 16 2016 07:36
@jshotkid I mean first one should be an iD, and second should be a class. So use a # and a . in your style.
arif hussain
@arifhussain0
Aug 16 2016 07:37
hello need some help.. just tell me how to understand these API related exercises because it just bombards code in without describing it
Paul
@paulkiio
Aug 16 2016 07:47
</style>
<h1 class="pink-text blue-text">Hello World!</h1>
<h1 id="orangetext">
trying to h1 the id of orange text but no luck.. hints?
dlhill615
@dlhill615
Aug 16 2016 07:47
@qualitymanifest I've tried a million ways. No success
bijukvasu
@bijukvasu
Aug 16 2016 07:48
I am having trouble on getting to the next step with this code, this code is to mark dead link using the hash symbol

<style>
.blue-text {color: blue;}
.red-text {color:red;}
p{font-size: 16px;
font-family: Monospace;
}
h2{
font-family: Lobster,Monospace ;
}

.smaller-image {width: 100px;}
.thin-red-border{
border-color: red;
border-width: 5px;
border-style: solid;
}

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


</style>

<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="Author standing on a beach with two thumbs up.">

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

<p> View more <a #href="http://www.freecatphotoapp.com"> Cat Photos </a> </p>

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

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

Can someone pls help
Xiao Yang
@xiaopow
Aug 16 2016 07:49
Hi @bijukvasu you can ask on www.codeforx.com and we will answer asap.
Paul
@paulkiio
Aug 16 2016 07:49
@bijukvasu remove the entire link and just put "#"
arif hussain
@arifhussain0
Aug 16 2016 07:50
@bijukvasu make href="#"
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 07:50
hey guys!
I am going to have a surgery now and oh god I am so scared
which me luck
Paul
@paulkiio
Aug 16 2016 07:52
good luck :+1:
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 07:52
anyone here had ingrown toenail before?
I am having it done
Paul
@paulkiio
Aug 16 2016 07:53
lol no
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 07:53
I will be chating while the doctor is doing it so I would get distracted
bijukvasu
@bijukvasu
Aug 16 2016 07:53
Thanks Arif, that worked
dlhill615
@dlhill615
Aug 16 2016 07:53
👍 lol
Paul
@paulkiio
Aug 16 2016 07:53
this dude talking about toes im over here trying to get help with code
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 07:54
I do help with codes too lol
Paul
@paulkiio
Aug 16 2016 07:54
worst case..you loose the toe
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 07:54
ok see ya guys in a bit
Paul
@paulkiio
Aug 16 2016 07:54

nomoreflipflops

bijukvasu
@bijukvasu
Aug 16 2016 07:54
Thanks Paul
Paul
@paulkiio
Aug 16 2016 07:55
:+1: @bijukvasu
dlhill615
@dlhill615
Aug 16 2016 07:55
Paul did it
anybody care to help me understand wha t needs to be done
dlhill615
@dlhill615
Aug 16 2016 07:56
Did you get it completely @jshotkid
Paul
@paulkiio
Aug 16 2016 07:56
</style>
<h1 class="pink-text blue-text">Hello World!</h1>
<h1 id="orange-text">
still trying to ...
need to give h1 id of "orange-text" @dlhill615
dlhill615
@dlhill615
Aug 16 2016 07:58
I don't believe u need<h1 id
Anjana Shekhar
@Anjie19
Aug 16 2016 07:58
Hi
I have a doubt
dlhill615
@dlhill615
Aug 16 2016 07:59
U can id=
Anjana Shekhar
@Anjie19
Aug 16 2016 07:59
why do we use a div element?
dlhill615
@dlhill615
Aug 16 2016 07:59
Div elements are like boxes
You can make changes to only the items u place in it @Anjie19
So you are able to contain or isolate specific items using div
Guess u got it now @jshotkid
Anjana Shekhar
@Anjie19
Aug 16 2016 08:02
Ohhhh. thanks @dlhill615
CamperBot
@camperbot
Aug 16 2016 08:02
anjie19 sends brownie points to @dlhill615 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for dlhill615
Paul
@paulkiio
Aug 16 2016 08:02
nah mate.. im stumped..
Sumit Kumar
@spark25
Aug 16 2016 08:03
@jshotkid what are you trying to do?
frisco3rd
@frisco3rd
Aug 16 2016 08:03
@jshotkid to give h1 orange text
h1 {
color: orange;
} @jshotkid
Paul
@paulkiio
Aug 16 2016 08:04

<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">Hello World!</h1>
<h1 id="orange-text">
dlhill615
@dlhill615
Aug 16 2016 08:04
You don't need to put
<h1 id="orange-text">
frisco3rd
@frisco3rd
Aug 16 2016 08:05
@jshotkid yea remove "orange-text" and "pink-text blue-text"
Paul
@paulkiio
Aug 16 2016 08:05
I do somewhere according to the instructions..
dlhill615
@dlhill615
Aug 16 2016 08:05
No hash tag before your color in style
Sumit Kumar
@spark25
Aug 16 2016 08:05
ohhh @jshotkid u ont need to put id to h1 separately
do this <h1 class="pink-text blue-text" id="orange-text" >Hello World!</h1>
dlhill615
@dlhill615
Aug 16 2016 08:06
Exactly @spark25
And if I'm not mistaking, the # used in his style should be something else
Sumit Kumar
@spark25
Aug 16 2016 08:07
remember u need to put id after the class if you want h1 to be orange
the precedence is given according to the sequence of the
Paul
@paulkiio
Aug 16 2016 08:08
holy $& lol slowly but surely I will get the hang of the rules and terms.. thanks @dlhill615 @spark25
CamperBot
@camperbot
Aug 16 2016 08:08
jshotkid sends brownie points to @dlhill615 and @spark25 :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for dlhill615
:warning: jshotkid already gave spark25 points
Sumit Kumar
@spark25
Aug 16 2016 08:08

@dlhill615 no to style a id u need to put # before the id
the syntax is #id-name{

}

dlhill615
@dlhill615
Aug 16 2016 08:09
👍
I can't ccomplete the remainder challenge @spark25 are you familiar
Sumit Kumar
@spark25
Aug 16 2016 08:12
what challeneg are you on? @dlhill615
dlhill615
@dlhill615
Aug 16 2016 08:15
Finding the remainder
Paul
@paulkiio
Aug 16 2016 08:20
how long have you guys been at it @spark25 @dlhill615 ??
on freecodecamp that is..
Sumit Kumar
@spark25
Aug 16 2016 08:21
@jshotkid not long i joind last night :smile: i am on challenge 76
Paul
@paulkiio
Aug 16 2016 08:21
geez.. your an animal
Sumit Kumar
@spark25
Aug 16 2016 08:23
Sort of. Actually i have coding experience I am a Computer Science student. I thought it would be cool to do some extra project of these kinds
Paul
@paulkiio
Aug 16 2016 08:24
Cant hurt at all, I am trying to soak it all up, not sure what path exactly , I think programmer but I have zero experience.. well some now :+1:
frisco3rd
@frisco3rd
Aug 16 2016 08:26
can somebody help me with this challenge https://goo.gl/rsb6L7
dlhill615
@dlhill615
Aug 16 2016 08:27
A few days
Anjana Shekhar
@Anjie19
Aug 16 2016 08:27
how is the id element different from div?
if anyone is free
please tell mee
dlhill615
@dlhill615
Aug 16 2016 08:28
Id identifies div contains
Anjana Shekhar
@Anjie19
Aug 16 2016 08:29
as in?
in the challenges, both were being used to create backgrounds and boxes
dlhill615
@dlhill615
Aug 16 2016 08:29
Id is like a label
Anjana Shekhar
@Anjie19
Aug 16 2016 08:29
they were separators?
dlhill615
@dlhill615
Aug 16 2016 08:29
Div is more like a box
@spark25 no hrlp
Sumit Kumar
@spark25
Aug 16 2016 08:31
@Anjie19 Id is given to a particualr element for example a particular heading, paragraph or image
whereas
div is used to create a division or block it contains more than one elements you can say it wraps several elements together on which you can do styling collectively
dlhill615
@dlhill615
Aug 16 2016 08:31
Divs are like separators @Anjie19
Sumit Kumar
@spark25
Aug 16 2016 08:33
@frisco3rd whats problem are you facing
you simply need to change the syntax of the switch with the lookup syntax
dlhill615
@dlhill615
Aug 16 2016 08:36
Do you not want to help me also @spark25
Sumit Kumar
@spark25
Aug 16 2016 08:38
@dlhill615 what problem are u facing? plz share the code.. i'l tyr my best to help you out
frisco3rd
@frisco3rd
Aug 16 2016 08:39
@spark25 might be a dumb question but int he switch what is the syntax......... is it switch its self
Sumit Kumar
@spark25
Aug 16 2016 08:43

@frisco3rd the syntax for switch is:
switch(expression) {
case n:
code block
break;
case n:
code block
break;
default:
default code block

}

working of a swich case:

The switch expression is evaluated once. The value of the expression is compared with the values of each case.
*If there is a match, the associated block of code is executed.

P.S. no question is a dumb question :sparkles:
Juniel
@Djkookie
Aug 16 2016 08:46
Hi Guys . .
dlhill615
@dlhill615
Aug 16 2016 08:48
11 % 3
Sumit Kumar
@spark25
Aug 16 2016 08:50
11%3 = 2 :tongue:
dlhill615
@dlhill615
Aug 16 2016 08:57
Tried it
No success
Sumit Kumar
@spark25
Aug 16 2016 08:59
ok bro give me the exact problem, what are you trying to do. if possible, also share the code.
@xiaopow are you a full time developer?
Anjana Shekhar
@Anjie19
Aug 16 2016 09:06
Hiiii
I have another doubt
<style>
.injected-text {
margin-bottom: -25px;
text-align: center;
}
what does margin-bottom:-25px do here?
Ahmed Tarek
@ahmedtarek2134
Aug 16 2016 09:07
:laughing: :laughing: :laughing: :laughing: :laughing: they delayed the surgery
Sumit Kumar
@spark25
Aug 16 2016 09:08
@Anjie19 read the instructions on the left pane of the challenge page you'll know :smile:
frisco3rd
@frisco3rd
Aug 16 2016 09:12
@spark25 phonetics [alpha] = "Adams";
@frisco3rd var phonetics = {
"alpha": "Adams",
"bravo": "Boston",
"charlie": "Chicago",
"delta": "Denver",
"echo": "Easy",
"foxtrot": "Frank",
Paul
@paulkiio
Aug 16 2016 09:13
every time I'm asked to put something in a div using a class I forget the format.. This is asking me to nest all my html with an element class of "container-fluid"
<div .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>