These are chat archives for FreeCodeCamp/HelpFrontEnd

20th
Nov 2016
Alexander Zachreson
@alectz
Nov 20 2016 00:18
Hi I am trying to fancy up the twitter button on my random quote machine and I have not been able to figure out how to get the actual quote text into my twitter href. check out my pen here: http://codepen.io/alectz/pen/RoaeVR?editors=1010
iceveda06
@iceveda06
Nov 20 2016 00:26
hey guys
anyone did the random quote machine
Ian Lee
@asparism
Nov 20 2016 00:28
yeah i did the quote machine
Ian Lee
@asparism
Nov 20 2016 00:36
@alectz at first glance, i would add a target attribute to your anchor element, so target="_blank" which opens in a new tab b/c codepen doesn't let you redirect inside the codepen browser... but i'm having trouble getting on to twitter.com at all right now
Ian Lee
@asparism
Nov 20 2016 00:47
does anyone know why this codepen won't clearInterval properly? it's for the pomodoro clock: http://codepen.io/Asparism/pen/ENNxBP?editors=0010
perik1996
@perik1996
Nov 20 2016 01:03
Hey! I have a question. How do I make the caption box to stick around the picture, and not all the way to the sides? Been trying google, couldnt find it. It is in html & bootstrap, no css allowed. Any tips or hints?
NITIN RAGHAV
@nitinraghav
Nov 20 2016 01:08
I just finished Weather app challenge heres the codePen. Kindly share your suggestions/comments . thanks
http://codepen.io/nitinraghav/pen/rWjwZR?editors=1010
Ken Haduch
@khaduch
Nov 20 2016 01:49
@nitinraghav - I think that it looks good - one thing that you could do it turn off the text-decoration on the F / C link and windspeed. The other thing that you might do is link the temperature units and windspeed units, since you might consider having both of them in the same unit system? Although it seems that the windspeed units selection doesn't do anything? But it looks good, responsive behavior looks good to, at least on the desktop. I haven't tried it on a mobile device...
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:53
Hello all i am trying to center my text on the tribute page <h1 class="text-center> Robert Haacker </h1> is the code
Ken Haduch
@khaduch
Nov 20 2016 01:53
@nitinraghav - just tried your weather site on my phone - it seems to be clipping the bottom of the page off. At least that is what I see in the edit and full page modes. If I switch it to "debug" mode (by changing the URL), then it shows the entire page, but it is not responsively formatting to a single column. Perhaps you should try going into the HTML panel and selecting the "insert the most common viewport meta tag" from the bottom of the HTML config panel?
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:53
am i doing something wrong?
Ken Haduch
@khaduch
Nov 20 2016 01:53
@SouthernGameDesign - hello there - you need to close the quotation marks on text-center, maybe that's doing it? Or you might need that class on the parent div?
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:54
sorry they are closed but it is still sitting to the left of the page...
Ken Haduch
@khaduch
Nov 20 2016 01:55
@SouthernGameDesign - do you have the class text-center on the parent div? It would be easier to try and help if you posted your URL to your project, easier than guessing? Have you loaded the Bootstrap.css?
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:55
Ken Haduch
@khaduch
Nov 20 2016 01:56
yeah, @SouthernGameDesign - go to the CSS panel and quick-add " Bootstrap" to your CSS, you don't have it there.
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:57
@khaduch ah thank you lol
CamperBot
@camperbot
Nov 20 2016 01:57
southerngamedesign sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1948 | @khaduch |http://www.freecodecamp.com/khaduch
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:57
Im still getting the hang of all this \
Ken Haduch
@khaduch
Nov 20 2016 01:58
@SouthernGameDesign - that's a common problem, but you'll get used to thinking about all of those little details - good luck!
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 01:59
Thank you for the advise im doing this to better my understanding on code to incorporate into my game design classes
Ken Haduch
@khaduch
Nov 20 2016 02:00
@SouthernGameDesign - definitely a good idea - the more you know, the better!
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 02:01
@khaduch indeed
Ken Haduch
@khaduch
Nov 20 2016 02:03
@asparism - looks like you might not have gotten an answer - you are declaring a global variable theTimer, but in your countDown function, you are declaring a local variable setTimer - you should eliminate the var from the var setTimer = in your countDown function. Then your global variable should properly store the setInterval return, and you'll be able to stop the interval timer when you want to.
c0d0er
@c0d0er
Nov 20 2016 02:08

@jdtdesigns thanks, which margin up top needs to be lowered? what is token selection here?

I'd lower the margin up top, so the token selection is not off screen.

CamperBot
@camperbot
Nov 20 2016 02:08
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 773 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
NITIN RAGHAV
@nitinraghav
Nov 20 2016 02:11
@khaduch thanks for the review updated both the changes. :)
CamperBot
@camperbot
Nov 20 2016 02:11
nitinraghav sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1949 | @khaduch |http://www.freecodecamp.com/khaduch
JD Tadlock
@jdtdesigns
Nov 20 2016 02:21
@c0d0er Where you choose x or o. It's pushed down off screen.
c0d0er
@c0d0er
Nov 20 2016 02:26
@jdtdesigns now if i choose x or o, then it hide through $('.xo').hide();, how could i lower the margin up top to make better?
Johnny
@JohnnyBizzel
Nov 20 2016 02:27
@nitinraghav White text on a white background! :D
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 02:30
so I am just trying to have fun until i get the hang of coding so here is my tribute page for fun so far lol http://codepen.io/RBHaacker/pen/xRgawG
Ken Haduch
@khaduch
Nov 20 2016 02:40
@SouthernGameDesign - very large image! Don't forget to close your <div> tags with a </div>!
Ken Haduch
@khaduch
Nov 20 2016 02:55
@SouthernGameDesign - to make things easier - one of the things that you can do when entering code into CodePen is to enter just the tag name, like "div" (without the quotes) and then hit the TAB key - it will convert them to the <div></div> tags, so you get the angle brackets and closing tag all at once.
JD Tadlock
@jdtdesigns
Nov 20 2016 02:55
@c0d0er Place the token select up top instead. That would better for UX(user experience);
Major Dills
@Major4k
Nov 20 2016 02:57
so guys i am stuck
i need some suggestions
please
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 02:58
@khaduch is this looking better?http://codepen.io/RBHaacker/pen/xRgawG
c0d0er
@c0d0er
Nov 20 2016 02:58
@jdtdesigns you mean put x or o option under tic tac toe title and over game board?
JD Tadlock
@jdtdesigns
Nov 20 2016 02:59
@c0d0er Yes
Major Dills
@Major4k
Nov 20 2016 02:59
is there a way to stop animations once you click a link?
Ken Haduch
@khaduch
Nov 20 2016 03:02
@SouthernGameDesign - I think so. To me, it is rarely necessary to have a picture that fills the entire screen, at least as a "foreground" image. Background images are a different story. If your top-level picture fills the screen, it "hides" the text, which is usually where you are really giving the information on your site. So I like it better with the reduced size.
c0d0er
@c0d0er
Nov 20 2016 03:03
@jdtdesigns thanks!
CamperBot
@camperbot
Nov 20 2016 03:03
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave jdtdesigns points
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:04
@khaduch -should i put the image as a background?
Ken Haduch
@khaduch
Nov 20 2016 03:06
@SouthernGameDesign - not in this case, I wouldn't think? You might put an image of something related, such as the White House, or a casino, or a group of people - something that would go along with the story...
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:08
@khaduch ok cool have you done the portfolio yet?
Ken Haduch
@khaduch
Nov 20 2016 03:09
@SouthernGameDesign i have a portfolio - probably something taht I would want to go and revisit after doing more "learning" about this stuff. I found for my background information that using the Bootstrap "themes" section on w3schools.com/bootstrap (as well as looking at the other lessons there for Bootstrap) were very helpful in getting a better idea about how to approach the portfolio page and design and formatting of it.
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:11
@khaduch would you be up to sharing it trying to get a general idea of what i will be doing before i start on it.
Major Dills
@Major4k
Nov 20 2016 03:11
@jdtdesigns http://codepen.io/major4k/full/JbXYXE/ go full screen and click search bar. click on portfolio then click about me and you'll see what my problem is
Ken Haduch
@khaduch
Nov 20 2016 03:11
@SouthernGameDesign - you can find the link on my freecodecamp.com homepage, if you want to see it.
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:12
@khaduch ok thank you
CamperBot
@camperbot
Nov 20 2016 03:12
southerngamedesign sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 1950 | @khaduch |http://www.freecodecamp.com/khaduch
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:13
@khaduch how do i get to your home page?
Ken Haduch
@khaduch
Nov 20 2016 03:15
@SouthernGameDesign - see the link in the post previous to yours - the URL after my name in the brownie point report is it.
Sam MacHose
@Mac33d
Nov 20 2016 03:16
Hey guys. So I just started to get into the tribute page challenge and so far i'm getting the hang of things. I just have a question about how to put have a <p> and a <li> element share the same background instead of two seperate things https://codepen.io/Mac33d/pen/aBpjOR
Major Dills
@Major4k
Nov 20 2016 03:16
@jdtdesigns well i fixed it a good bit. but it still has the little twitch when i click around with the liinks in the search bar
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:16
@khaduch thank you
CamperBot
@camperbot
Nov 20 2016 03:16
southerngamedesign sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: southerngamedesign already gave khaduch points
JD Tadlock
@jdtdesigns
Nov 20 2016 03:17
@Major4k To be blunt, there's way too much goin on. From a UX stand point, it's hard to navigate. Sometimes simpler is better.
Major Dills
@Major4k
Nov 20 2016 03:18
well im every beginner in level lol dont even no what UX means. im definitely going over the top on the portfolio page but its fun
thanks tho dude
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:28
so when we get certified in any of the three certs how do we get the cert?
NITIN RAGHAV
@nitinraghav
Nov 20 2016 03:29
@JohnnyBizzel isnt it showing a background-image?
Sam MacHose
@Mac33d
Nov 20 2016 03:32
@nitinraghav no like for the text I wanted to have them both in the same white background. When they both come up as separate white boxes.
c0d0er
@c0d0er
Nov 20 2016 03:43
@jdtdesigns if i put between title and game board, then when it hides, the game board will move higher, any idea to fix?
Sam MacHose
@Mac33d
Nov 20 2016 03:44
did everyone leave?
NITIN RAGHAV
@nitinraghav
Nov 20 2016 03:44
@Mac33d sorry Sam I dint get u
JD Tadlock
@jdtdesigns
Nov 20 2016 03:44
@c0d0er Post your pen again
Sam MacHose
@Mac33d
Nov 20 2016 03:45
@nitinraghav its aight. did you see my post?
NITIN RAGHAV
@nitinraghav
Nov 20 2016 03:45
@Mac33d yes I did
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:46
@khaduch hey found a typo on your code for your portfolio
Sam MacHose
@Mac33d
Nov 20 2016 03:46
@nitinraghav oh. you just didnt understand what im trying to ask or?
Ken Haduch
@khaduch
Nov 20 2016 03:50
@SouthernGameDesign oh, good! I haven't looked at it in quite a while... where is it?
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:51
blob
the <@!
NITIN RAGHAV
@nitinraghav
Nov 20 2016 03:51
@Mac33d yes i dint quite get it.
Sam MacHose
@Mac33d
Nov 20 2016 03:53
@nitinraghav ok so im quite new to coding so i might not have the terminology down. but rn im trying to get these two to have the same white background instead of two seperate pieces. <div> <p align="center"> Evidence that disproves Patrick's theory about mayonaise. </p> <li align="center"> Patrick</li>
</div>
Ken Haduch
@khaduch
Nov 20 2016 03:53
@SouthernGameDesign - I just fixed it - I think that I had focus on the wrong window when trying to post a chat - I found it in the HTML validator, but thanks for pointing it out!
CamperBot
@camperbot
Nov 20 2016 03:53
khaduch sends brownie points to @southerngamedesign :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @southerngamedesign |http://www.freecodecamp.com/southerngamedesign
Sam MacHose
@Mac33d
Nov 20 2016 03:54
@nitinraghav p, li{ font-family: sans-serif;
Font-size: 30px;
background-color: white;
padding: 20px;
margin: 20px}
JD Tadlock
@jdtdesigns
Nov 20 2016 03:59
@c0d0er You can just create a class that sets the opacity to 0 and visibility to hidden. That way you won't see it, but it will still take up the height. ;)
SouthernGameDesign
@SouthernGameDesign
Nov 20 2016 03:59
@khaduch No problem man other than that it looks great
NITIN RAGHAV
@nitinraghav
Nov 20 2016 03:59
@Mac33d can u pls share the code
Sam MacHose
@Mac33d
Nov 20 2016 04:00
sure. can you see it from my codepen? https://codepen.io/Mac33d/pen/aBpjOR
c0d0er
@c0d0er
Nov 20 2016 04:00
@jdtdesigns got it, thanks!
CamperBot
@camperbot
Nov 20 2016 04:00
c0d0er sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 774 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Sam MacHose
@Mac33d
Nov 20 2016 04:10
@nitinraghav i posted it but forgot to mention ya
NITIN RAGHAV
@nitinraghav
Nov 20 2016 04:19
i hope this is what you were looking for.
Sam MacHose
@Mac33d
Nov 20 2016 04:20
@nitinraghav ty! what did you change to do that?
CamperBot
@camperbot
Nov 20 2016 04:20
mac33d sends brownie points to @nitinraghav :sparkles: :thumbsup: :sparkles:
:cookie: 268 | @nitinraghav |http://www.freecodecamp.com/nitinraghav
Sam MacHose
@Mac33d
Nov 20 2016 04:22
@nitinraghav oh you went into css and added that.
NITIN RAGHAV
@nitinraghav
Nov 20 2016 04:23
also check some more code pens once you are done with your challenge there are few things like you dont need to add CSS to your HTML files anymore you can consolidate all CSS in separate CSS files. you can add bootstrap (and other libraries) from "gear" sign on top of HTML, CSS and JS pages respectively.
@Mac33d yes I just put bot the required elements in a div and gave <div> a BG color.
Sam MacHose
@Mac33d
Nov 20 2016 04:25
@nitinraghav gotcha. Thanks brotha.
CamperBot
@camperbot
Nov 20 2016 04:25
mac33d sends brownie points to @nitinraghav :sparkles: :thumbsup: :sparkles:
:warning: mac33d already gave nitinraghav points
NITIN RAGHAV
@nitinraghav
Nov 20 2016 04:25
@Mac33d happy to help :)
BTW I like ur concept of tribute to Patrick really cool brigns back all the memories when I was crazy bout this show.
Sam MacHose
@Mac33d
Nov 20 2016 04:27
@nitinraghav lmao thanks dude. A good ol meme i remembered.
CamperBot
@camperbot
Nov 20 2016 04:27
mac33d sends brownie points to @nitinraghav :sparkles: :thumbsup: :sparkles:
:warning: mac33d already gave nitinraghav points
Ghost
@ghost~580ed9c0d73408ce4f309ef0
Nov 20 2016 04:38
HELO WORLD
i need help in gaping between the two information
in bootstrap
Nitin Chandran Nair
@NitinNair89
Nov 20 2016 05:23
@vipuldcoder Show us what you did and what you want to achieve? :)
Zapp_Brannigan
@dggz93
Nov 20 2016 05:25
hey
how can i send my tribute page
they ask for a link
Nitin Chandran Nair
@NitinNair89
Nov 20 2016 05:26
copy the link from codepen and paste it there
Zapp_Brannigan
@dggz93
Nov 20 2016 05:26
can i send just the .html?
codepen?
Nitin Chandran Nair
@NitinNair89
Nov 20 2016 05:27
yes.. Do the challenges in codepen.io website and get the link
Zapp_Brannigan
@dggz93
Nov 20 2016 05:27
got it
thanks
Nitin Chandran Nair
@NitinNair89
Nov 20 2016 05:27
:)
Gwhite
@gwhiteMZW
Nov 20 2016 05:57
blob
BUG? why my all results are exactly correct but not passed
grantknaver
@grantknaver
Nov 20 2016 06:01
Maybe someone can catch what I aint seeing right now. I think I am missing a curly bracket or something. When I correct this blatant error the page refuses to load when I set the contents of a var using document.getElementByID
Actually this is a two part question.
  1. I think I am missing a curly bracket because the console keeps prompting errors - can some help me catch what I aint seeing?
  1. When I set a new var's contents using document.getElementById() the page errors out - can anyone give me some insight into this?
Here is my code ```
grantknaver
@grantknaver
Nov 20 2016 06:13
anybody out there any ideas
Gwhite
@gwhiteMZW
Nov 20 2016 06:19
@grantknaver may be the script tag is too way ahead
try to run you script when the page is completely load.
ed
grantknaver
@grantknaver
Nov 20 2016 06:26
thanks @gwhiteMZW Ill give it a try
CamperBot
@camperbot
Nov 20 2016 06:26
:cookie: 9 | @gwhitemzw |http://www.freecodecamp.com/gwhitemzw
grantknaver sends brownie points to @gwhitemzw :sparkles: :thumbsup: :sparkles:
Gwhite
@gwhiteMZW
Nov 20 2016 06:30
: )
grantknaver
@grantknaver
Nov 20 2016 06:37
dangit
what does a 404 error mean
I know the website I reaching out to exists and I am getting the JSON info from it.. this doesnt make sense
ahhhh
Jordan
@jordanallain
Nov 20 2016 06:45
404 means the info you requested wasn't found
Gwhite
@gwhiteMZW
Nov 20 2016 06:55
have you considered cross area rigion control @grantknaver
grantknaver
@grantknaver
Nov 20 2016 07:23
I figured it out Gwhite the name I was using for the var was a reserved key word
anyone still around
Gwhite
@gwhiteMZW
Nov 20 2016 07:26
.
then it should be marked with special color shouldn't it
NITIN RAGHAV
@nitinraghav
Nov 20 2016 07:50
I am trying to add a thumbnail to my portfolio page:
<div class="row">
          <div class="col-xs-12 col-sm-6 col-md-4 ">
            <a class="thumbnail" href="https://codepen.io/nitinraghav/pen/zKjqWx"><img src="C:\Users\NITIN\Desktop\capture.JPG" alt="Tribute Page">Tribute Page</a>
          </div>
CamperBot
@camperbot
Nov 20 2016 07:50
:bulb: to format code use backticks! ``` more info
Nitin Chandran Nair
@NitinNair89
Nov 20 2016 07:59
@nitinraghav Can't use your personal desktop drives on codepen
upload the image on some server
NITIN RAGHAV
@nitinraghav
Nov 20 2016 08:01
@NitinNair89 thanks
CamperBot
@camperbot
Nov 20 2016 08:01
nitinraghav sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 356 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
NITIN RAGHAV
@nitinraghav
Nov 20 2016 08:06
@NitinNair89 tried it still dint work
<div class="col-xs-12 col-sm-6 col-md-4 ">
            <a class="thumbnail" href="https://codepen.io/nitinraghav/pen/zKjqWx"><img src="https://drive.google.com/file/d/0B5dJ11BUUOWtdHYxS25ldlNCUTg/view?usp=sharing" alt="Tribute Page">Tribute Page</a>
          </div>
Sorin Ruse
@sorinr
Nov 20 2016 08:20
@nitinraghav try uploading your imgs to http://cloudinary.com and then change the links to ur pen. it doesn't work for me ether to load the img from google drive
NITIN RAGHAV
@nitinraghav
Nov 20 2016 08:25
@sorinr thanks bro it worked
CamperBot
@camperbot
Nov 20 2016 08:25
nitinraghav sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 859 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Nov 20 2016 08:25
@nitinraghav welcome
白振华
@aiyicha
Nov 20 2016 08:43
"Build a Simon Game", where is the mp3 files,how can i use it on my page
solve it
grantknaver
@grantknaver
Nov 20 2016 10:22
anyone awake
grantknaver
@grantknaver
Nov 20 2016 10:30
I cant get some of my nested functions to fire...namely Direction, anyone have any ideas?
AlBMyName
@IshmaRey-Hool
Nov 20 2016 10:35

Hi I'm doing...
https://www.freecodecamp.com/challenges/show-the-local-weather

This is my CodePen link...
http://codepen.io/Ishma-Reyhool/pen/WGXqdO

My problem is that I don't know how to get data from the Open Weather API.

grantknaver
@grantknaver
Nov 20 2016 10:39
I was just there man I can help
Use the Api mentioned in the Local Weather breakdown and expectations.
sign up and get your App ID
grantknaver
@grantknaver
Nov 20 2016 10:44
than follow the process explained in these two movies:
that will get you the JSON data at which point you use JSON.parse() to translate it into content you can use and boom :)
If anyone can take a look at my code for some reason I cant get any of my nested functions to fire - any help would be appreciated
Purcea Robert
@RobertPurcea
Nov 20 2016 11:53
hello can somebody help me please with a little bit of CSS
im trying to make an animation so that when you hover over the icons(facebook, etc) they grow a little in size
kirbyedy
@kirbyedy
Nov 20 2016 12:05
example
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Nov 20 2016 14:16
Hi everyone, how did you manage to put images of your projects for your portfolio ? Did you just take a screen shot of your app and save it as an image or something else ?
David Michelet
@Peioa
Nov 20 2016 14:23
I'm trying to line up my text and my pic. Can somebody help me ?
https://codepen.io/Peioa/full/WoRerv/
@thomlom I think you can put a href to the codepen.io website address of your project
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Nov 20 2016 14:27
@Peioa I've tried but it's not working
David Michelet
@Peioa
Nov 20 2016 14:28
@thomlom even when you put the address of the full page view ??
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Nov 20 2016 14:31
@Peioa Yup. Concerning your problem, I've modified your code a little bit : here it is and now your text and your pic are aligned :)
<body style="background-image:url(http://i2.wp.com/www.wallpapersbyte.com/wp-content/uploads/2015/07/Black-Dark-Spot-White-Texture-Background-Pattern-WallpapersByte-com-1366x768.jpg?w=1240)">
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />
    <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-8">
                <h2 class="text-center">David Michelet</h2>
            </div>
            <div class="col-xs-4">
                <br>
                <button type="button" style="font-size:16px">About <i class="fa fa-info-circle"></i></button>
                <button style="font-size:16px">Portfolio <i class="fa fa-book"></i></button>
                <button style="font-size:16px">Contact <i class="fa fa-pencil-square-o"></i></button>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-4">
                <h3>A jazz fan, trying to understand how coding works. Baby steps but getting a good feeling out of it...</h3>
            </div>
            <div class="col-xs-8">
                <img class="img img-responsive displayed" src="http://cdnstatic.visualizeus.com/thumbs/84/87/artists,bw,billieholiday,jazz,music,photography-84872e411de8a154924ddabc496c6067_h.jpg?ts=93246" alt="lady day singing">
            </div>
        </div>
        <br>
        <br>
        <p class="text-center">Music gives a soul to the universe, wings to the mind, flight to the imagination, and life to everything.</p>
    </div>
    </div>
</body>
@Peioa The problem is that you didn't close your first div class='row' correctly
David Michelet
@Peioa
Nov 20 2016 14:37
Perfect, thank you @thomlom Excellent
CamperBot
@camperbot
Nov 20 2016 14:37
peioa sends brownie points to @thomlom :sparkles: :thumbsup: :sparkles:
:cookie: 438 | @thomlom |http://www.freecodecamp.com/thomlom
David Michelet
@Peioa
Nov 20 2016 14:41
2 questions: First how do I get my menu to always appear on the screen (I mean by scrolling I want the menu to always stay on top and the rest of the page can scroll)
Second question: How do i link my buttons to part of my page (same page) Do I create an ID ? and in that case where do I place that id in my button code ?
Thank you so much for your time
https://codepen.io/Peioa/full/WoRerv/
Ghost
@ghost~56ef2a8b85d51f252ab9dec9
Nov 20 2016 14:43
@Peioa You should definitely check this page for fixed navbars : https://getbootstrap.com/components/#navbar-fixed-top
For each part of your portfolio, you have to create an <a> element, put an hrefattribute to the ID element of your page.
Here is a working example :
        <nav class="navbar navbar-default navbar-fixed-top">
            <div class="container-fluid">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <p class="navbar-brand">Thomas Lombart</a>
                </div>

                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#home">About</a></li>
                    <li><a href="#skills">Skills</a></li>
                    <li><a href="#projects">Projects</a></li>
                    <li><a href="#home">Contact</a></li>
                </ul>
            </div>
        </nav>
And below the code there is these elements (with the id) :
        <div id="home">
            <p class="text-center">Front-End developer</p>
        </div>
David Michelet
@Peioa
Nov 20 2016 14:46
Thanks @thomlom , I'm going to take a look at it but your example is perfect, i got it
CamperBot
@camperbot
Nov 20 2016 14:46
peioa sends brownie points to @thomlom :sparkles: :thumbsup: :sparkles:
:warning: peioa already gave thomlom points
lolopuhffs
@lolopuhffs
Nov 20 2016 14:56
Hey, guys! Could you please help me center div2 and div (id="biography") in div 1? https://codepen.io/lolopuhffs/pen/eBgeZK?editors=1100
Evan Kalvis
@evan17gr
Nov 20 2016 15:34
http://codepen.io/evan17gr/pen/zoNjWr I want to resize the size of the picture so you can't see the background on the corners of the image
Anyone know how to do that?
Brandon
@bd1887
Nov 20 2016 15:42
http://codepen.io/elad2412/pen/PwWjLL
Hi guys. Quick CSS question. Is there a way to adjust the border-radius property for a shape like this so that it's inverted on the x-axis (curving up at the ends instead of down?) I also want to avoid using transform: rotatex(180deg); since I'm going to be putting text into it, and that inverts the text as well :-/
I'm not sure I understand all the numbers after border-radius, and I can't figure out how to manipulate them to get it to curve the other way
Brandon
@bd1887
Nov 20 2016 15:49
Nevermind. I see what's happening. It's an oval but 3 of the 4 borders are invisible. I just need to make the top border visible instead. Thanks everyone!
Johnny
@JohnnyBizzel
Nov 20 2016 16:13

@nitinraghav

@JohnnyBizzel isnt it showing a background-image?

It was not showing an image for "Fog" last night but it is today for light rain.

jolio007
@jolio007
Nov 20 2016 16:36
Hey guys, I just built a navigation bar. When I'm writing a paragraph or a <h1>, it goes automatically behind it. I tried to separate both using divs but it doesn't solves it. I always thought that it everything was just falling one after another life a lego
kirbyedy
@kirbyedy
Nov 20 2016 16:39
@jolio007 push the h1 down with top margin
or padding
jolio007
@jolio007
Nov 20 2016 16:41
@kirbyedy I thought about doing that but isn't there a way it automatically fall underneath? I was looking for an alternative to that and reasoning behind it
Thanks though kirbyedy
kirbyedy
@kirbyedy
Nov 20 2016 16:43
maybe you should try with bootstrap
Tom
@moT01
Nov 20 2016 16:43
@jolio007 u saying you want them vertical?
Caleb Whiting
@whmountains
Nov 20 2016 16:43
@jolio007 Is this a fixed nav bar that stays on top when you scroll?
@jolio007 if so the simplest way is to add a padding-top to your body element to match the height of your header.
Eckard Ritter
@xsmobi
Nov 20 2016 16:44
I completed the assignment "Show the local weather". When I run it locally, it works. But on Codepen it does not prompt for the navigator permission to get geo data, and therefore it does not run. Any idea?
http://codepen.io/xsmobi/pen/MbJRPW
Additionally I hosted it here:
http://freecodecamp-xsmobi-local-weather.bitballoon.com/
jolio007
@jolio007
Nov 20 2016 16:45
Yes! @whmountains Oh yeahhhh you're so right. I forgot about the whole fixed nav bar. sorry for the silly question. Thank you for your answer
CamperBot
@camperbot
Nov 20 2016 16:45
jolio007 sends brownie points to @whmountains :sparkles: :thumbsup: :sparkles:
:cookie: 11 | @whmountains |http://www.freecodecamp.com/whmountains
Tom
@moT01
Nov 20 2016 16:45
@xsmobi works for me on codepen
maybe something on your browser settings or you click like always block or something
kirbyedy
@kirbyedy
Nov 20 2016 16:47
@xsmobi check your console.log
grantknaver
@grantknaver
Nov 20 2016 16:47
If anyone can take a look at my code for some reason I cant get any of my nested functions to fire - any help would be appreciated. Here is my code...http://codepen.io/GrantKnaver/pen/gLgQdg?editors=0010
kirbyedy
@kirbyedy
Nov 20 2016 16:47
@xsmobi geolocation does not work from unsecure origins, so your pen starts with http:// which is unsecure
if you start with https:// it should work
Eckard Ritter
@xsmobi
Nov 20 2016 16:48
@moT01 Really? Great. So I can submit it. Indeed, I tried on Firefox and it's ok. Thanks for your help
CamperBot
@camperbot
Nov 20 2016 16:48
xsmobi sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 320 | @mot01 |http://www.freecodecamp.com/mot01
Tom
@moT01
Nov 20 2016 16:48
@grantknaver what one
ones
your ajaxget has a ( at the beginning
but its showing the data so that must be working
Eckard Ritter
@xsmobi
Nov 20 2016 16:50
@kirbyedy thank you for looking into it. Did not figure it out completly. At least, on Firefox it works.
CamperBot
@camperbot
Nov 20 2016 16:50
xsmobi sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1556 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Nov 20 2016 16:51
yes but not everyone is using firefox :)
so all the people who use chrome, or ie or safari wont see the forecast
and thats a big bunch :)
anyways first you should start your pen with https://
then since your weather api is also loaded unsecured, you can use a small cheat
https://crossorigin.me/ in front of your api link, and it will work
Tom
@moT01
Nov 20 2016 16:53
@xsmobi works on my chrome and firefox
Brandon
@bd1887
Nov 20 2016 17:00
Hi everyone. I need help with some stupid CSS stuff I'm trying to do.
Tom
@moT01
Nov 20 2016 17:01
@bd1887 whats up
Brandon
@bd1887
Nov 20 2016 17:01
I have a div that is curved at the bottom, and I'm trying to send text to the bottom of that div and curve with it. I'm not sure it's possible without using a CSS preprocessor which I don't want to get into right now.
To complicate it further, I'd like to have the text extend beyond the div and hidden, so that when it scrolls, the center text is always at the bottom of the div circle
If you look here, it might make it more obvious what I'm talking about
There's an oval div with text in it that I will make transparent. I left it visible so you can see the div I'm talking about
Sorry. I know this might be a hard question.
Tyler Moeller
@TylerMoeller
Nov 20 2016 17:04
@bd1887 That's going to be a little painful to implement :) for starters, you may want to look at this pen to see how they did it. http://codepen.io/team/css-tricks/pen/a5b2847df84a9e88f3d3c1544d1681ad
An article with more details here: https://css-tricks.com/set-text-on-a-circle/
Tom
@moT01
Nov 20 2016 17:06
that does look painful
Brandon
@bd1887
Nov 20 2016 17:07
lol
Tyler Moeller
@TylerMoeller
Nov 20 2016 17:07
@xsmobi I'd recommend fixing your weather APP. Firefox will block navigator.geolocation on insecure origins in the future too, just as Chrome does now. See this for background: FreeCodeCamp/FreeCodeCamp#7853
Tom
@moT01
Nov 20 2016 17:07
could make an image with the text in it and put the image in there
Brandon
@bd1887
Nov 20 2016 17:10
@TylerMoeller I saw that circle text codepen, will the text be able to scroll? I need the bottom number to be the lowest number, and the farther away numbers to appear to disappear from the sides of the eggtimer (like they're going behind it)
Sorin Ruse
@sorinr
Nov 20 2016 17:34
@xsmobi as @TylerMoeller said google geolocation is https sensitive. if you need an alternative to openweather api you can use this api i found out that works ether http or https: https://www.apixu.com/api.aspx And if you r afraid u will exceed the free limit you can just grab a response json put it in a var and work on it until you are ready with your design and after just switch to the api call
Abhishek Kumar Roy
@thunderoy
Nov 20 2016 17:36
Hi all, I am creating a persona;
Hi all, I am creating the personal portfolio webpage but facing a problem, my webpage contains large background images and due to which the scroll is not smooth and its lagging, please help how to fix it.
Tom
@moT01
Nov 20 2016 17:41
make the image smaller
smaller as in mb
Sorin Ruse
@sorinr
Nov 20 2016 17:44
@moT01 give the img a width="100px" or a height="100px" witch one is most important
Tom
@moT01
Nov 20 2016 17:46
i dunno, i think if you set one the other is set automatically based on the original dimensions
Abhishek Kumar Roy
@thunderoy
Nov 20 2016 17:49
well i am just giving this "background-size: 100% 100%;"
and giving 100px will not cover the entire screen
Tom
@moT01
Nov 20 2016 17:50
i meant, open the image in an editor and save is so it takes up less memory
but it will have the same dimensions
Abhishek Kumar Roy
@thunderoy
Nov 20 2016 17:53
you mean save it locally?
JD Tadlock
@jdtdesigns
Nov 20 2016 17:54
@moT01 Setting the image to a smaller resolution in your css won't change the file size. You'll need to open the image in an editor like Photoshop or Gimp and lower the quality/size to reduce the file size.
@thunderoy
Tom
@moT01
Nov 20 2016 17:54
that's what i said
JD Tadlock
@jdtdesigns
Nov 20 2016 17:55
@thunderoy You can also just use background-size: cover;
for keeping it the full width of the container
background-position: center center; to make to sure it always keep the image centered
Abhishek Kumar Roy
@thunderoy
Nov 20 2016 17:57
@jdtdesigns i have used background-size: cover; but the problem remains
JD Tadlock
@jdtdesigns
Nov 20 2016 17:58
your container needs to be set to the width height before the image will work with cover
Evan Kalvis
@evan17gr
Nov 20 2016 18:00
https://codepen.io/evan17gr/pen/zoNjWr anyone that can help me pls
o
Abhishek Kumar Roy
@thunderoy
Nov 20 2016 18:01
@jdtdesigns ok let me see
Evan Kalvis
@evan17gr
Nov 20 2016 18:01
im trying to amke sure that when i use the bottom scrollbar to move right, the large image will cover the corners
id unsersatnd why it wont cover it
Evan Kalvis
@evan17gr
Nov 20 2016 18:10
Anyone?
Ivan Temchur
@ttemcha
Nov 20 2016 18:11
@evan17gr just a sec
try this. is that what you want ?
background: url('http://cdn.paper4pc.com/images/pattern-backgrounds-wallpaper-7.jpg') no-repeat;
background-size: cover;
@evan17gr and delete that background attribute from your body element
its not a good practice
@evan17gr add those rules to your body selector
@evan17gr it didnt cover the corners because the size of background image is smaller than horizontal content and i repeats by default. you need to add no-repeat and set size to cover
Ivan Temchur
@ttemcha
Nov 20 2016 18:16
@evan17gr 1 question. why do you need so much horizontal space that scrollbar appears? its no quite readable. is it part of your design ?
Evan Kalvis
@evan17gr
Nov 20 2016 18:21
ok i added that to my body
i dont know why taht thing with the scrollbar is ahppening
that's what im trying to get rid off
ty for the help btw
Ivan Temchur
@ttemcha
Nov 20 2016 18:28
@evan17gr its happening because your images are too big
Evan Kalvis
@evan17gr
Nov 20 2016 18:29
yes i dont r eally mind that the scrollbar apperas
the thing is that when u use the scrollbar to go right
the image doesnt cover that section for some reason
Ivan Temchur
@ttemcha
Nov 20 2016 18:29
try to set to all of them max-width: 100% or give each of them a bootstrap class="img-responsive"
Evan Kalvis
@evan17gr
Nov 20 2016 18:30
so do that to every image?
Jun Kim
@junjkim
Nov 20 2016 18:31
Hello Coders!!!
I am on the Build a Tribute Page
whos with me??
Ivan Temchur
@ttemcha
Nov 20 2016 18:33
@evan17gr i see you have not wrapped your content in to a container div
@junjkim just finished yesterday
Evan Kalvis
@evan17gr
Nov 20 2016 18:34
what does a container div do?
Jun Kim
@junjkim
Nov 20 2016 18:34
@ttemcha ahh how was it? did u take a while?
Evan Kalvis
@evan17gr
Nov 20 2016 18:35
@junjkim im doing it rn
Jun Kim
@junjkim
Nov 20 2016 18:35
@evan17gr shiii its kinda difficult no?
Evan Kalvis
@evan17gr
Nov 20 2016 18:35
but its annoying me :worried:
yep
u have to do research
Jun Kim
@junjkim
Nov 20 2016 18:35
@evan17gr yea same here lol im going back to my solutions
Evan Kalvis
@evan17gr
Nov 20 2016 18:35
and ask others
Ivan Temchur
@ttemcha
Nov 20 2016 18:35
@evan17gr you wrap all content in a container div to keep it in one place and not letting it spread horizontally
Jun Kim
@junjkim
Nov 20 2016 18:35
@evan17gr who are you writting about?
Evan Kalvis
@evan17gr
Nov 20 2016 18:35
michael jackson
Jun Kim
@junjkim
Nov 20 2016 18:36
@junjkim oh nice. im just writting about myself lol i can do that right?
Evan Kalvis
@evan17gr
Nov 20 2016 18:36
@ttemcha so i need to make a div for all the body?
i think you do that on the next challenge
@junjkim lol
Ivan Temchur
@ttemcha
Nov 20 2016 18:36
@evan17gr you dont need body in codepen
Jun Kim
@junjkim
Nov 20 2016 18:36
@evan17gr ohh ok ima do a tributee for mohammad ali then rip
Evan Kalvis
@evan17gr
Nov 20 2016 18:37
:)
why?
Ivan Temchur
@ttemcha
Nov 20 2016 18:37
@junjkim it took me about one evening you can take a look :smile:
@evan17gr because their editor assumes that all write in html is already in body tag
Evan Kalvis
@evan17gr
Nov 20 2016 18:38
@ttemcha lol yours looks a lot more professional than mine
Ivan Temchur
@ttemcha
Nov 20 2016 18:38
@evan17gr actually i dont, just read documentation
Evan Kalvis
@evan17gr
Nov 20 2016 18:39
do u have previous knowledge of coding? @ttemcha ?
except from codecamp?
do u think that if i leave my wepage with taht scrollbar problem
Ivan Temchur
@ttemcha
Nov 20 2016 18:40
@evan17gr i read 1-2 book about CSS thats it
Evan Kalvis
@evan17gr
Nov 20 2016 18:40
its going to look shit?
Ivan Temchur
@ttemcha
Nov 20 2016 18:41
@evan17gr no dont leave it like that. i'll see what can i do. READ
Jun Kim
@junjkim
Nov 20 2016 18:43
@ttemcha daaang dude urs is legit
ryanmaddox
@ryanmaddox
Nov 20 2016 18:44
Hello
Evan Kalvis
@evan17gr
Nov 20 2016 18:44
@ryanmaddox hi
Ivan Temchur
@ttemcha
Nov 20 2016 18:44
@junjkim thanks. appreciate it!
CamperBot
@camperbot
Nov 20 2016 18:44
ttemcha sends brownie points to @junjkim :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @junjkim |http://www.freecodecamp.com/junjkim
Rajindrajith
@Rajindrajith
Nov 20 2016 18:45
@ttemcha how to add big quotes ? it is looks nice
Evan Kalvis
@evan17gr
Nov 20 2016 18:45
i think u use the svg element, but not sure
ryanmaddox
@ryanmaddox
Nov 20 2016 18:46
You can us the "q" tag in case
I mean in css
Ivan Temchur
@ttemcha
Nov 20 2016 18:51
@Rajindrajith i added as a png usdin psuedo-class selector:before
Jun Kim
@junjkim
Nov 20 2016 18:53
man im fkin lost with this tribute page challenge
@ttemcha u used css as well? but we dont have to right
Evan Kalvis
@evan17gr
Nov 20 2016 18:56
u can use whatever way u prefer
Ivan Temchur
@ttemcha
Nov 20 2016 18:56
@junjkim yeah. i decided yo use css, cause i dont like bootstrap
@junjkim i've read 2 books about css
Evan Kalvis
@evan17gr
Nov 20 2016 18:56
lol i can see
Jun Kim
@junjkim
Nov 20 2016 18:56
@ttemcha i see
@evan17gr how far are you?
Ivan Temchur
@ttemcha
Nov 20 2016 18:58
@junjkim this online book is awesome for me
@evan17gr do some research on your problem
Jun Kim
@junjkim
Nov 20 2016 18:59
@ttemcha awesome! thanks
CamperBot
@camperbot
Nov 20 2016 18:59
junjkim sends brownie points to @ttemcha :sparkles: :thumbsup: :sparkles:
:cookie: 163 | @ttemcha |http://www.freecodecamp.com/ttemcha
Ivan Temchur
@ttemcha
Nov 20 2016 18:59
@junjkim anytime
Reece Langerock
@ReeceLangerock
Nov 20 2016 19:01
I can't make a button link to an outside site on codepen. I'm trying to use target="_blank" but not working
is there some trick to this i'm missing?
Ivan Temchur
@ttemcha
Nov 20 2016 19:01
@ReeceLangerock do you have code to show?
Rajindrajith
@Rajindrajith
Nov 20 2016 19:02
what happening when click Fork button?
Reece Langerock
@ReeceLangerock
Nov 20 2016 19:02
<button class="btn btn-primary form-control" type="button" <a href="www.facebook.com" target="_blank"</a>Facebook</button>
Rajindrajith
@Rajindrajith
Nov 20 2016 19:02
what happening when click Fork button in codepen?
@ttemcha that site very nice
Reece Langerock
@ReeceLangerock
Nov 20 2016 19:03
I tried using opening it with JS too and that tried to open it but couldn't figure out how to get the target part to work with it
Ivan Temchur
@ttemcha
Nov 20 2016 19:04
@Rajindrajith didnt try. i think you will have a copy of a pen in your profile
@ReeceLangerock try this
<button class="btn btn-primary form-control" type="button"><a href="www.facebook.com" target="_blank">Facebook</a></button>
Evan Kalvis
@evan17gr
Nov 20 2016 19:06
@evan17gr
@junjkim i think i ll finish by today
@ttemcha i ll try but its difficult to find about this problem
Ivan Temchur
@ttemcha
Nov 20 2016 19:07
@ReeceLangerock also you need to specify full url like: http://facebook.com
abtak mustapha
@mustapha88
Nov 20 2016 19:07
@mustapha88
hello every body
im working on recipe box projects and everything is little clean so far until when i want to edit specific recipe it suppose to return in input the title and ingredient of that recipe but instead it return always the title and ingredients of the first recipe created i set input value to this.state.title any one help what is the probleme?thank's
Ivan Temchur
@ttemcha
Nov 20 2016 19:09
@evan17gr your html and css doesnt look very readable. read about Style Guides
Reece Langerock
@ReeceLangerock
Nov 20 2016 19:09
@ttemcha That worked. Thanks!
CamperBot
@camperbot
Nov 20 2016 19:09
reecelangerock sends brownie points to @ttemcha :sparkles: :thumbsup: :sparkles:
:cookie: 166 | @ttemcha |http://www.freecodecamp.com/ttemcha
jKard1210
@jKard1210
Nov 20 2016 19:14
My xml status keeps returning 0 when I make requests to Wikipedia
Alexander Zachreson
@alectz
Nov 20 2016 19:14
I am having a hell of a time trying to get my Random quote machine twitter button to work the way i want
Does anyone know how to take local values for variables and put them into global scope?
Ivan Temchur
@ttemcha
Nov 20 2016 19:15
@ReeceLangerock no problems
Alexander Zachreson
@alectz
Nov 20 2016 19:17
my issue is that I can't get my quote variable into a scope where this $('a').attr("href","https....") will use it.
and when i move my .attr into the scope where the variable is defined, it does not work
Jack Lyons
@JackEdwardLyons
Nov 20 2016 19:29
hi guys, i have a probably very easy question... but I'm wondering why my simple code is returning undefined, I'm trying to use ES6 classes and simply log something in the console!
Jack Lyons
@JackEdwardLyons
Nov 20 2016 19:40
ohh, nm instead of writing this.body = body i wrote body = this.body
Tyler Moeller
@TylerMoeller
Nov 20 2016 19:49
@bd1887 I'm sure it's possible, but I don't have an solution to offer at the moment.
Zapp_Brannigan
@dggz93
Nov 20 2016 19:54
hi
when i send my tribute page
will i receive some mail or something?
it's supposed to be certified
Joshua
@ckent20
Nov 20 2016 19:56
just send the link on the fcc.
and can also send the link to https://gitter.im/FreeCodeCamp/CodeReview so other campers review it
Zapp_Brannigan
@dggz93
Nov 20 2016 19:59
ok, thanks!
jKard1210
@jKard1210
Nov 20 2016 20:13
Any idea why this attempt at using the wikipedia api keeps returning an xhr status of zero? http://codepen.io/James1999/pen/WoRqGp
Tessa
@TheTessaMurphy
Nov 20 2016 20:31
So, I've finished my twitch tv program at last, but I'm not very happy with it. My other json programs work much more smoothly. Also, the program keeps saying that some channels are online when I know they're not. I can't figure out if this is something in my code I'm missing or just a glitch in the api workaround they gave us.If anybody else could take a look, a second (or third or fourth) set of eyes would be greatly appreciated. http://codepen.io/TessaMurphy/full/zoNgqO/
JD Tadlock
@jdtdesigns
Nov 20 2016 20:39
@TheTessaMurphy A for loop will often cause issues with ajax requests. I'd use .forEach() or .map() ;)
Tessa
@TheTessaMurphy
Nov 20 2016 20:40
@jdtdesigns thanks!
CamperBot
@camperbot
Nov 20 2016 20:40
:cookie: 775 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
thetessamurphy sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
David Michelet
@Peioa
Nov 20 2016 20:44
Hi, little question, i'm trying to put my first exercice page into my portfolio website but cannot seem to make it work
https://codepen.io/Peioa/pen/WoRerv
And how can I make a text responsive ??
Caleb Whiting
@whmountains
Nov 20 2016 20:49
@Peioa What exactly isn’t working?
Maksim Kulichenko
@makstheimba
Nov 20 2016 20:50
How can I transition element back after :hover or :active smoothly?
when I apply transition to hover and I hover over the element it all goes very smooth, but after I remove cursor from an element it just jumps straight back up
David Michelet
@Peioa
Nov 20 2016 20:51
@whmountains first I want to make my text responsive just like the pics, then I'm trying to make an img with href of my webpage for my portfolio but can't work
Caleb Whiting
@whmountains
Nov 20 2016 20:52
@Peioa I see a few problems:
  1. Your entire document isn’t wrapped in a <div class=“container-fluid”></div>
  2. each section should be wrapped in a <div class=“row”></div>
David Michelet
@Peioa
Nov 20 2016 20:53
ok, I take a look
Caleb Whiting
@whmountains
Nov 20 2016 20:53
@makstheimba I’ve had that problem. It happens when you put the transition property on the hover state. You have to put it under the base state.
Maksim Kulichenko
@makstheimba
Nov 20 2016 20:55
@whmountains thanks
CamperBot
@camperbot
Nov 20 2016 20:55
makstheimba sends brownie points to @whmountains :sparkles: :thumbsup: :sparkles:
:cookie: 16 | @whmountains |http://www.freecodecamp.com/whmountains
Caleb Whiting
@whmountains
Nov 20 2016 20:57
@Peioa just to be clear, you do have a container-fluid but it’s only around your navbar. It needs to be around your whole document. (just inside <body>)
Tessa
@TheTessaMurphy
Nov 20 2016 20:57
@jdtdesigns could you kind of walk me through the foreach? I'm having trouble wrapping my brain around callbacks.
JD Tadlock
@jdtdesigns
Nov 20 2016 21:08
@TheTessaMurphy I usually use .map for the shorter syntax and the ability to update value content in the array. http://jsbin.com/vogofow/edit?js,console
Tessa
@TheTessaMurphy
Nov 20 2016 21:09
@jdtdesigns Oh thank goodness, I thought I was going to have to rewrite that whole entire function. Thank you again.
CamperBot
@camperbot
Nov 20 2016 21:09
thetessamurphy sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: thetessamurphy already gave jdtdesigns points
JD Tadlock
@jdtdesigns
Nov 20 2016 21:10
welcome :)
David Michelet
@Peioa
Nov 20 2016 21:11
@whmountains thanks for the info with the container fluid. I think i cleaned up the code, would you mind taking a look ?
https://codepen.io/Peioa/full/WoRerv/
CamperBot
@camperbot
Nov 20 2016 21:11
peioa sends brownie points to @whmountains :sparkles: :thumbsup: :sparkles:
:cookie: 17 | @whmountains |http://www.freecodecamp.com/whmountains
David Michelet
@Peioa
Nov 20 2016 21:14
why isn't the font size of my text responsive ???
Tessa
@TheTessaMurphy
Nov 20 2016 21:21
@jdtdesigns The map worked and I love that I learned something new but the glitch keeps happening. Could it be that I have a json call within a json call?
JD Tadlock
@jdtdesigns
Nov 20 2016 21:26
@TheTessaMurphy I still see a for loop
JD Tadlock
@jdtdesigns
Nov 20 2016 21:28
@TheTessaMurphy Switch the channels call with the streams call
JD Tadlock
@jdtdesigns
Nov 20 2016 21:39
@TheTessaMurphy You're using if's in a switch
that doesn't work
You can only use ternaries for conditionals in a switch
Tessa
@TheTessaMurphy
Nov 20 2016 21:40
Oh! I wondered about that.
U-ways
@U-ways
Nov 20 2016 21:41
@Peioa font-size aren't responsive by default! You can do this little trick to handle that:
// wildcard selector
* { 
  font-size: calc(.6vw + 14px);
}

// Style your text elements with the `em` unit.
h1 {
  font-size: 2.1em;
} h2 {
  font-size: 1.7em;
}
@Peioa Read more about CSS units here to understand what is going on: http://www.w3schools.com/cssref/css_units.asp
Tessa
@TheTessaMurphy
Nov 20 2016 21:44
@jdtdesigns Of course the problem is that I don't want anything to happen if the value is false. I'm wondering if instead of ternary it wouldn't just be easier to have a function for each button.
@jdtdesigns or use nested if statements, which would probably be the easiest.
Tessa
@TheTessaMurphy
Nov 20 2016 21:58
@jdtdesigns That's what I get for trying to be clever.
JD Tadlock
@jdtdesigns
Nov 20 2016 22:13
@TheTessaMurphy Here's an example. http://jsbin.com/vogofow/edit?js,output
Tessa
@TheTessaMurphy
Nov 20 2016 22:17
@jdtdesigns Two questions (let me know when I start becoming a pain in the tookas) what are you doing with the first var? And what does the prepend do?
JD Tadlock
@jdtdesigns
Nov 20 2016 22:19
The status var is a ternary expression. It's like an if/else setter. var status = <if condition> ? (if condition is true status equals this) : (else status equals this);
prepend just adds the html to the beginning of the div instead of at the end
Once you learn ternaries they'll change your code world :D
You can chain ternaries inside other ternaries as well
It's considered bad practice to go past 3 nested ternaries though
Alexander Zachreson
@alectz
Nov 20 2016 22:32
how do you do links on codepen?
my page keeps turning white when i click the link but it works when i right click and open in new tab
Ellias
@Tron2097
Nov 20 2016 22:33
Hey I just started my basic develpment project and i'm not quite sure what the 2nd rule means. what exactly is a user story. any help would be appreciated thanks in advance
Tessa
@TheTessaMurphy
Nov 20 2016 22:34
@jdtdesigns This phrase status = stream.stream === null ? 'offline' : stream.stream === undefined ? 'closed' : 'online';
I'm seeing that status equals the result of the ternary, yes? So the conditional is stream.stream===null. Then the first statement after that should be if true, which would be that status would equal the string 'offline'. So then there's a second statement, which would be if it's not true, and is that another ternary, so basically if stream = null, it's offline, but if not offline then if undefined it's closed but if not undefined it's online. Did I just mess that up?
@TheTessaMurphy So status would either be offline, closed or online, yes?
@jdtdesigns So status would either be offline, closed, or online, yes?
JD Tadlock
@jdtdesigns
Nov 20 2016 22:35
@TheTessaMurphy Correct ;)
Tessa
@TheTessaMurphy
Nov 20 2016 22:50
@jdtdesigns what does the .then do?
Matt K
@MattKim22
Nov 20 2016 22:53
@Tron2097 The user stories are specified in 4. and 5.
Tessa
@TheTessaMurphy
Nov 20 2016 22:54
@jdtdesigns Thank you yet again. I'm going to have to play with this, I think.
CamperBot
@camperbot
Nov 20 2016 22:54
thetessamurphy sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 776 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
zachfoster
@zachfoster
Nov 20 2016 22:58
could someone in here explain the differences between xhtml and html5 I was looking on youtube and was kinda confused
Greg D
@mosaic-greg
Nov 20 2016 23:03
afaik, xhtml is old tech and you shouldnt need to learn it
Shawn Grooms
@SEGrooms
Nov 20 2016 23:07
Anyone able to help on my tic-tac-toe project?
I’m trying to figure out how to get the computer player to work, but the boolean value I’m assigning isn’t working.
Banron
@Banron
Nov 20 2016 23:11
the closing bracket for function computerPlayer(val) is coming right after the opening bracket
function computerPlayer(val){}
Shawn Grooms
@SEGrooms
Nov 20 2016 23:12
@Banron I haven’t even touched the computerPlayer function yet. I’m having issues with the conditional statement right after it.
When I click “One player”, it should be entering the if statement. Unfortunately this isn’t happening :/
Greg D
@mosaic-greg
Nov 20 2016 23:14
@SEGrooms what line is that on
Shawn Grooms
@SEGrooms
Nov 20 2016 23:15
@mosaic-greg line 149
Banron
@Banron
Nov 20 2016 23:15
Could it have something to do with the boolean value being initialised through let?
Greg D
@mosaic-greg
Nov 20 2016 23:16
@SEGrooms i checked in the console, it said "onePlayer is not defined"
Banron
@Banron
Nov 20 2016 23:16
Let makes it a local variable
what if you change it to var xTurn = true?
Shawn Grooms
@SEGrooms
Nov 20 2016 23:16
@mosaic-greg the variable isn’t defined until the one player or two player button is clicked.
Greg D
@mosaic-greg
Nov 20 2016 23:16
i've already clicked it
Shawn Grooms
@SEGrooms
Nov 20 2016 23:16
@Banron having it as let vs var shouldn’t make a difference
hmm...
@mosaic-greg any idea why that is happening?
Greg D
@mosaic-greg
Nov 20 2016 23:18
these first-slide / second-slide id's could have better names
Shawn Grooms
@SEGrooms
Nov 20 2016 23:18
@mosaic-greg I added a console.log to the button and it is doing what I want it to, which is why I’m confused
@mosaic-greg for the buttons? I put comments about them stating one player and two player
Chose X and Chose Os
@mosaic-greg @Banron it is being initialized, but not the conditional isn’t functioning
@mosaic-greg @Banron is it possible that the conditional statement is firing before the button is being clicked?
Greg D
@mosaic-greg
Nov 20 2016 23:25
this computerPlayer function is quite big and hard to read
Shawn Grooms
@SEGrooms
Nov 20 2016 23:26
@mosaic-greg are you talking about the two player mode?
@mosaic-greg the computerPlayer function isn’t being used yet
It is currently empty
@mosaic-greg I commented it out for you to avoid confusion
Greg D
@mosaic-greg
Nov 20 2016 23:31
@SEGrooms codepen has a feature where the functions collapse when you click to the left of them. This isnt working for me on your pen, does it for you?
Shawn Grooms
@SEGrooms
Nov 20 2016 23:32
@mosaic-greg yes it does for me
Greg D
@mosaic-greg
Nov 20 2016 23:34
@SEGrooms it looks like your entire JS is within the document.ready function
i think thats not what you want
Shawn Grooms
@SEGrooms
Nov 20 2016 23:35
@mosaic-greg would that be affecting the outcome?
Greg D
@mosaic-greg
Nov 20 2016 23:36
@SEGrooms i think so, for example i can't access tileChanger() or showWinnerSlide() from the console
maybe try moving most of your code out of there
Shawn Grooms
@SEGrooms
Nov 20 2016 23:38
@mosaic-greg I moved them outside
@mosaic-greg it doesn’t seem to have made a difference :/
Shawn Grooms
@SEGrooms
Nov 20 2016 23:44
@mosaic-greg man I am stumped. The values are initializing, but they aren’t being read by the conditional...
I think I need to take a break. Thank you @mosaic-greg
CamperBot
@camperbot
Nov 20 2016 23:48
segrooms sends brownie points to @mosaic-greg :sparkles: :thumbsup: :sparkles:
:cookie: 389 | @mosaic-greg |http://www.freecodecamp.com/mosaic-greg
Shawn Grooms
@SEGrooms
Nov 20 2016 23:48
I’ll let you know if I figure it out
lalith77
@lalith77
Nov 20 2016 23:50
can someone tell me how to access values from collections/ dictionaries/ objects?
Jack Lyons
@JackEdwardLyons
Nov 20 2016 23:57
Hi guys, im trying to sort my array of posts by Date, im wondering if my output += code is not allowing it to be sorted?