These are chat archives for FreeCodeCamp/HelpFrontEnd

17th
Feb 2017
Michael Harrison
@protoluz
Feb 17 2017 00:16
So after hitting my head against the wall trying to scale an img to bootstrap grid i found the problem, CodePen is the problem when you use Quick-add>bootstrap it loads version 4.0.0-alpha.6
when i used version/3.3.5/ no problem.
Robert Donahue
@Godiniis
Feb 17 2017 00:23
Hello everyone. Can someone tell me how to use an image for the background on my page?
Anyone out there?
Johnny
@jtan3
Feb 17 2017 00:28
in css its background: url("link");
@Godiniis
Robert Donahue
@Godiniis
Feb 17 2017 00:29
Thank you
Miguel T Rivera
@mtrivera
Feb 17 2017 00:30
Could use help with promises. I'm at my wit's end at this point.
Muhammad Muhktar Musa
@mcube25
Feb 17 2017 01:22
please i want to know why my calculator is giving me this expression instead of 1+2 it says 1 operator 2,is there something i missed here is my codepen https://codepen.io/mcube25/pen/vgMBaK
James Moore
@James-N-M
Feb 17 2017 03:08
Hey does anyone know how to make a html fit the entire screen
html canvas *
Like im trying to run this browser paint tool and it only seems to draw to half the screen
nvm now its magically working properly
grantson
@grantson
Feb 17 2017 03:17
Someone give me some feedback for my portfolio page? https://codepen.io/grantsOn/pen/MJRWQg
James Moore
@James-N-M
Feb 17 2017 03:20
@grantson center your picture of yourself
john94
@lpy1994
Feb 17 2017 03:21
@grantson most people tend to put the about section first.
Miguel T Rivera
@mtrivera
Feb 17 2017 03:35
@grantson I would line the social media icons horizontal and put them in the top right
grantson
@grantson
Feb 17 2017 03:43
picture is centered now gonna work on the social media icons
thanks everyone for the feedback
ill re-post soon
RLD2121
@RLD2121
Feb 17 2017 04:09
Hi all, can someone take a look at my portfolio, wondering why the nav-pill isn't working on the other texts and why the float-right isn't working: http://codepen.io/RLD2121/pen/XpQOqx
Mac
@itchick85
Feb 17 2017 04:15
I can't get my other navbar elements to be the same as the color of my name in my portfoliohttp://codepen.io/itchick85/pen/RKENBR
Erik Moore
@averagebeard
Feb 17 2017 04:33
@itchick85 you need to also include a color for your <a> elements in your html. They come with a default coloring that isn't overwritten in the <body>
Miguel T Rivera
@mtrivera
Feb 17 2017 04:48
@RLD2121 have you tried using bootstrap 3? I noticed your using bootstrap-4-alpha
grantson
@grantson
Feb 17 2017 05:03
can someone help me out? I showed this earlier. I am struggling finding out how to place my social media icons at the bottom side by side..or in a sidebar of some sort. https://codepen.io/grantsOn/pen/MJRWQg?editors=1100
Ken Haduch
@khaduch
Feb 17 2017 05:13

@grantson - one way to do it, not necessarily the only way, and someone might come up with a better way, is to define a class like this:

.socialIcons {
  display:inline-block;
}

And att class="socialIcons" on each of the divs that contains your icon and anchor tag. Also, close each div right after the anchor tag - don't nest them.

grantson
@grantson
Feb 17 2017 05:15
yup, that makes sense
@khaduch Thanks mate Ill try it out and let ya know how it went
CamperBot
@camperbot
Feb 17 2017 05:15
grantson sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2492 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Feb 17 2017 05:16
@grantson - yeah, it might need a little tweaking because I got the "Send email" button and the three social icons lined up on the same line, but it's close... good luck!
@grantson - it should be display: inline-block; - I changed it in the browser tools, not in my codepen... Please note that!
grantson
@grantson
Feb 17 2017 05:22
@khaduch Still doesn't seem to want to work on mine, not sure what I have incorrectly, but thanks ! It looks like I have all the information just need to read the code a bit more closely
CamperBot
@camperbot
Feb 17 2017 05:22
grantson sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: grantson already gave khaduch points
grantson
@grantson
Feb 17 2017 05:23
It just takes the "send-email" down to the codepen icon but everything else remains the same
when I do all the above
oh wait I need to add class to all my <a> tags as well ?
Ken Haduch
@khaduch
Feb 17 2017 05:27

@grantson - I closed my copy of the pen with it in - but you want to have your divs structured like this:

<div class="socialIcon">
    <a whatever the link and icon is></a>
</div>

I made that change before I added the class with the display: inline-block; - and deleted all of what would then be extraneous </div> tags afterward.

@khaduch I just closed an extra </div> tag under send email and then added <center> to the social icon <div>
Ken Haduch
@khaduch
Feb 17 2017 05:28
@grantson - :+1:
grantson
@grantson
Feb 17 2017 05:28
@khaduch Worth turning in mate?
Ken Haduch
@khaduch
Feb 17 2017 05:28
yeah, you have to make sure that your html structure is clean, it helps a lot!
@grantson - sure, except for the text that I'm sure you'll eventually update, it looks good. I didn't check responsive behavior, but I'm getting offline for now - good luck with that! :)
grantson
@grantson
Feb 17 2017 05:31
@khaduch Haha, yes I will update that. Just wanted to get all the elements and features in for now...thanks for the feedback! Onto Javascript!
CamperBot
@camperbot
Feb 17 2017 05:31
grantson sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: grantson already gave khaduch points
rsxhoxhi
@rsxhoxhi
Feb 17 2017 05:56
@alpox It meant that originally, but now it's just a metaphor for walking from one pub to the next. One could take it literally and crawl, blind drunk, on all fours, but then you don't get any good photos for Instagram, and your head hurts for days.
Archit Chandra
@architchandra
Feb 17 2017 06:04

Hello. I have been banging my head against the wall because of a problem that seems simple enough but I can’t solve it. I am trying to build an image masonry-like gallery on a Bootstrap based webpage and have gotten all the grid issues and effects in order but the text overlay positioning on the image is still messed up and I can’t fix it. What I feel the main problem is is that the <p> element is taking on the height of the div it is contained in and this is preventing styles like text-align: centre; and align-items: centre; from applying (container has flex: direction; applied). I would be massively grateful if someone can help on this. I have literally spent hours trying to fix it but can’t even understand where the problem lies. Code snippets below (some of it is just to create the grid layout but including here just to help replicate the problem).

HTML:

  <div class="row no-gutter" id="tiles">
    <div class="col-lg-4 col-md-6 mx-auto">
      <a class="link-box" href="#">
        <div class="img-wrapper">
            <img class="img-thumbnail" src="https://c1.staticflickr.com/1/736/31933254544_3e0162f282_o.jpg" alt="Card image cap">
              <div class="img-text">
                <p>Placeholder 1</p>
              </div>
        </div>
      </a>
    </div>
  </div>

CSS:

.no-gutter .img-thumbnail  {
  padding: 0;
  border-radius: 0;
  min-width: 100%;
  display: flex;
}

.row.no-gutter  {
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.row.no-gutter > [class*="col-"],
.row.no-gutter > [class^="col-"]  {
  padding: 0;
  margin: 0;
}

.img-wrapper  {
  width: 100%;
  height: 250px;
  overflow: hidden;
  background-color: #000;
  position: relative;
}

.img-wrapper img  {
  display: block;
  float: left;
  width: 100%;
  opacity: 1;
  -webkit-transition: opacity 0.35s;
}

.img-wrapper:hover img  {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.img-wrapper .img-text  {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  display: flex;
}

.img-wrapper a  {
  display: block;
}

.img-text p  {
  position: relative;
  margin: 0;
  color: white;
  font-size: 1.8em;
  align-items: center;
}
Archit Chandra
@architchandra
Feb 17 2017 06:22
The <p> element text is coming on the top-left of the image whereas I want it in the dead centre.
Steven
@Ironwrangler
Feb 17 2017 06:35
Finding a Remainder in JavaScript.
Can someone explain this to me .i am not for some reason understanding what is being asked
Gulsvi
@gulsvi
Feb 17 2017 07:02
@Ironwrangler
5 divided by 2: 5/2 = 2 with a remainder of 1.
So, the remainder of 5 divided by 2 is: 5 % 2 = 1
20 divided by 7: 20/7 = 2 with a remainder of 6
So, the remainder of 20 divided by 7 is: 20 % 7 = 6
For the exercise, they want you to set var remainder equal to the remainder of 11 divided by 3
Not sure if that's more confusing or not :) but basically, if you want to divide two numbers you use / if you want their remainder instead, use % in place of the /
Zhanibek
@zhann1982
Feb 17 2017 07:05
@taltmann42 thanks! I will try to write both variants and see what happens
CamperBot
@camperbot
Feb 17 2017 07:05
zhann1982 sends brownie points to @taltmann42 :sparkles: :thumbsup: :sparkles:
:cookie: 527 | @taltmann42 |http://www.freecodecamp.com/taltmann42
Chiu
@yuchiu
Feb 17 2017 07:05
show the local weather project, can't get the weather data, i checked on my own console and found the error :" Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource."
anyone got idea how to get pass it?
Zhanibek
@zhann1982
Feb 17 2017 07:07
@taltmann42 No, that didn't help.
Hello Everyone! My code for weather works in google chrome, but it doesn't work in firefox. I think it is happening because of geolocation settings. and i used " if (navigator.geolocation) ". Who knows how to fix it? http://codepen.io/zhann1982/pen/XpGgXJ
Johnny
@jtan3
Feb 17 2017 07:11
@yuchiu you should add http:// to your api url
Archit Chandra
@architchandra
Feb 17 2017 07:12
Hi. I think I didn’t present the problem properly earlier. I have created a JSfiddle to show it better. I need help in placing the placeholder text in the center of the image (horizontally and vertically). In my code text-align: centre; and align-items: centre; are not working for some reason. Here’s the link: https://jsfiddle.net/architchandra/ofkon3eh/
Gulsvi
@gulsvi
Feb 17 2017 07:13
@yuchiu and @zhann1982 I think you're both hitting the same issue. navigator.geolocation works over HTTPS but openweathermap only works over HTTP. You can't use both HTTP and HTTPS, so you need to use a different way to get location that works over HTTP or use a different weather API that works over HTTPS
Dark Sky is also a good weather API
@architchandra It must be a pain to spell everything as "center" instead of "centre" in your code. I'll bet it causes problems sometimes :)
Archit Chandra
@architchandra
Feb 17 2017 07:22
@SkyCoder01 Hey. I just checked to see if this was a problem but it looks to me like I’ve spelled all centres correctly. On a general note, I live in India where this ambiguity between British and American spellings is always present (I’ve personally spent hours on the English StackExchange on the most trivial of words). We just generally use use both interchangeably.
Chiu
@yuchiu
Feb 17 2017 07:22
@jtan3 the server return error"Failed to load resource: the server responded with a status of 502 (Bad Gateway)" when i add http:// in front of my api
@jtan3 @SkyCoder01 thank you both for replying and helping out, i ll figure a way out
CamperBot
@camperbot
Feb 17 2017 07:23
yuchiu sends brownie points to @jtan3 and @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 311 | @jtan3 |http://www.freecodecamp.com/jtan3
:cookie: 237 | @skycoder01 |http://www.freecodecamp.com/skycoder01
deepakSpatil
@deepakSpatil
Feb 17 2017 07:24
console.log(formattedData  ,"   formattedData");
                $.each(formattedData, function(key, value){
                    if (value.yaxisValue === "" || value.yaxisValue === null){
                        delete formattedData[key];
                    }
                });
console.log(formattedData  ,"   formattedData");

Screenshot from 2017-02-17 12:50:13.png

array of objects getting plotted in different forms

Zhanibek
@zhann1982
Feb 17 2017 07:37
@SkyCoder01 Which api I should use? Any advices?
Archit Chandra
@architchandra
Feb 17 2017 07:41
@SkyCoder01 Any help? Please please. I am just stuck. Can’t figure out what’s wrong. The height of the <p> element is 100% for some reason which I feel it shouldn’t be. Here’s the jsfiddle: https://jsfiddle.net/architchandra/ofkon3eh/
kirbyedy
@kirbyedy
Feb 17 2017 07:49
@architchandra
.img-wrapper .img-text {
    width: 100%;
    height: 100%;
you made it 100%
Screen Shot 2017-02-17 at 09.50.15.png
Archit Chandra
@architchandra
Feb 17 2017 07:54
@kirbyedy Yes, the idea was that the container should be 100% height of its container. But the <p> element, I supposed would not get 100% height but will get the height according to the content.
I took that from here, actually: https://miketricking.github.io/dist/
Effect 12
kirbyedy
@kirbyedy
Feb 17 2017 07:57
@architchandra I guess your p element inherits the attributes from img-text
because its nested inside that div
Archit Chandra
@architchandra
Feb 17 2017 08:02
@kirbyedy Maybe. I am still not sure. But I was able to fix it with someone’s help. Changing the width of the <p> element to 100% and applying align-items: center; to the .img-text (container) did it. And after that, the height of the <p> element is turning out to be content-defined. I’m not sure why that happened, though.
bleka
@bleka
Feb 17 2017 08:11
Is the tribute page about myself?
Grace Chen
@jingjinguser
Feb 17 2017 08:16
<div class="caption text-center">,caption在当中是什意思
kirbyedy
@kirbyedy
Feb 17 2017 08:16
@bleka well it can be, not really
@bleka dont you have any person you admire.. like a scientist or something...
bleka
@bleka
Feb 17 2017 08:18
@kirbyedy i didn't want to do it on myself, just wasn't sure if it was about me or someone else xd
Alexander Pawik
@Aleks1406
Feb 17 2017 08:46
@bleka you'll do a portfolio about yourself after that project
Joel
@okmarq
Feb 17 2017 09:04
hey guys
alpox
@alpox
Feb 17 2017 09:04
@c0d0er Do you mean how to setup the javascript for it how how the css works?
Joel
@okmarq
Feb 17 2017 09:05
how do i push an item to an array continuously while the previously pushed item is retained
c0d0er
@c0d0er
Feb 17 2017 09:05
@alpox how css works, like how could you move in the map which is inside the small square?
Joel
@okmarq
Feb 17 2017 09:22
thanks
i wanted to do it using a function that once called will automatically send an item to a preset variable then next call will send another different item to the same variable to make it two items in it
how do i create the functions
currently i have this code but my aim is to call getColor and each time it's pushed to the sequence i get a random color pushed to it color
var colors = [r,b,g,y];
var sequence = [];
function getRandomNumber(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min)) + min;
}
getRandomNumber(0,colors.length);
var getColor = colors[getRandomNumber(0,colors.length)];
c0d0er
@c0d0er
Feb 17 2017 09:34
@alpox thanks
CamperBot
@camperbot
Feb 17 2017 09:34
c0d0er sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 781 | @alpox |http://www.freecodecamp.com/alpox
Ellen
@ellenkorbes
Feb 17 2017 09:47
Good morning, all. Any Flexbox experts around? Could someone take a look at why .nav { align-items: center; } isn't doing its job there? Thank you :) http://codepen.io/ellenkorbes/pen/vgMgde
alpox
@alpox
Feb 17 2017 09:49
@ellenkorbes Actually it does its job but your ul element has some margin-bottom of which you have to get rid of
Ellen
@ellenkorbes
Feb 17 2017 09:50
Hmmmmmm
Ooooooo thanks alpox!
alpox
@alpox
Feb 17 2017 09:51
@ellenkorbes
Ellen
@ellenkorbes
Feb 17 2017 09:51
Wait, where's the cookie. Thanks @alpox ?
CamperBot
@camperbot
Feb 17 2017 09:51
ellenkorbes sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 782 | @alpox |http://www.freecodecamp.com/alpox
alpox
@alpox
Feb 17 2017 09:51
blob
Ellen
@ellenkorbes
Feb 17 2017 09:51
Ahhhhh
Yeah I was about to ask how you went about finding out
@alpox Any idea why navbar-toggler-icon isn't showing BTW?
I just copied that bit from the bootstrap templates. It was working at first but disappeared at some point.
alpox
@alpox
Feb 17 2017 09:55
@ellenkorbes Yup that i've seen actually :-) its because you didn't add jquery before bootstrap in the javascript settings
Ellen
@ellenkorbes
Feb 17 2017 09:55
Oh!
alpox
@alpox
Feb 17 2017 09:56
@ellenkorbes Another thing is that codepen just changed to import bootstrap version 4.0 alpha - so most of the code you will find to this point of bootstrap wont apply to it
Ellen
@ellenkorbes
Feb 17 2017 09:57
@alpox Yeah I know, I'm using the v4 code samples
alpox
@alpox
Feb 17 2017 09:57
Ah okay good
Ellen
@ellenkorbes
Feb 17 2017 09:57
I added jquery in the settings but the hamburger icon still won't show
It works if you click the place it's supposed to be at
But the icon itself doesn't appear
alpox
@alpox
Feb 17 2017 10:00
@ellenkorbes Ouh yeah bad one
@ellenkorbes Bootstrap v4 uses flexbox too. But has other settings for it for the navbar. For its navbar to work properly, it needs its predefined settings
You messed it up by using your own flex definitions on the navbar
As far as i see..
Or wait
Ellen
@ellenkorbes
Feb 17 2017 10:02
Ahhhh
alpox
@alpox
Feb 17 2017 10:02
Maybe i'm wrong
Hold on
Ellen
@ellenkorbes
Feb 17 2017 10:03
Alright
@alpox I tried putting navbar-inverse back into the nav classes, it makes the icon appear but it's all weird.
alpox
@alpox
Feb 17 2017 10:08
@ellenkorbes Okay. In your css you set margins to all button tags on your page. Also a width: 100%. This is what messes your button up.
Also, bootstrap requires you to put a class navbar-light on the nav element, which makes the button appear.
.contact input, textarea, select, button {
  width : 100%;
  margin: 0;
}
Happening here
Ellen
@ellenkorbes
Feb 17 2017 10:10
But that's only for contact class, no?
Or would it have to be .contact input, .contact textarea, .contact select, etc?
alpox
@alpox
Feb 17 2017 10:11
yup exactly
as soon as you put a commata, there is a totally new selector
.contact input, 
.contact textarea, 
.contact select, 
.contact button {
  width : 100%;
  margin: 0;
}
Ellen
@ellenkorbes
Feb 17 2017 10:12
Ohhhhhh
Yeah I just done that
How do you make stuff display as code within the chat like that?
alpox
@alpox
Feb 17 2017 10:13

```

<some code>
```

Ellen
@ellenkorbes
Feb 17 2017 10:13
Hack the planet!
alpox
@alpox
Feb 17 2017 10:13

In the above case to specify the highlighting i used:
```css

<some code>
```

Ellen
@ellenkorbes
Feb 17 2017 10:13
Hah! Cool!
alpox
@alpox
Feb 17 2017 10:13
That was an inline code what you did there :-)
With one backtick at beginning and end like this
Whole codeblocks start with a line of 3 back ticks, then code, then a line with 3 backticks again
Ayush Bahuguna
@relentless-coder
Feb 17 2017 10:14
Hi, I have a question. Is it necessary to follow grid system?
alpox
@alpox
Feb 17 2017 10:14
@relentless-coder What grid system?
Ellen
@ellenkorbes
Feb 17 2017 10:14
@alpox Alright, thanks, makes sense.
CamperBot
@camperbot
Feb 17 2017 10:14
:warning: ellenkorbes already gave alpox points
ellenkorbes sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
Ellen
@ellenkorbes
Feb 17 2017 10:14
@relentless-coder I could never wrap my head around it so I'm using flexbox instead.
alpox
@alpox
Feb 17 2017 10:15
Yea going with flexbox is much easier than old-school css to align stuff :D
But comes with the drawback of dropping IE9 support
But anyone who complains about that to me i would just tell they should finally get a real browser :D
Ellen
@ellenkorbes
Feb 17 2017 10:16
^ Yip.
Ayush Bahuguna
@relentless-coder
Feb 17 2017 10:17
@ellenkorbes @alpox I'm about to get in a argument with another front end developer about the use of grid system. Basically it is the fight over using bootstrap's grid system. My opnion is that it is not necessary if you can understand percentage widths
Ellen
@ellenkorbes
Feb 17 2017 10:18
@relentless-coder Me I just simply can't get it to work properly without a bunch of hacks, meanwhile flexbox works perfectly.
alpox
@alpox
Feb 17 2017 10:21
@relentless-coder Okay there are surely different opinions.
There are different things to look for.
  1. Do you really need a full-blown css framework or just use the grid? If you would just use the grid - please no. There are smaller grid systems out there - and as you say, working your own css out for that should suffice.
  2. Bootstraps grid have SOME things which can make your life easier like pulling/pushing columns for easy responsiveness. This you could solve with media queries - but this would be more of an effort.
  3. Once you use bootstrap, you are trapped with it.
Either way, if its only for the grid i would recommend against using bootstrap
@relentless-coder
Ellen
@ellenkorbes
Feb 17 2017 10:33
Screen Shot 2017-02-17 at 8.31.14 AM.png
@alpox If you still got the patience, any idea how to solve these issues? 1. The hamburger over the menu items, 2. The menu items being center aligned when invoked by the hamburger, 3. The hamburger showing up when there's clearly more than enough room for the menu to display in full?
Ellen
@ellenkorbes
Feb 17 2017 10:42
This is what I'm trying to mimic, no idea how I broke it: https://v4-alpha.getbootstrap.com/examples/navbar-top-fixed/
Probably with all the flexing.
Fabio Di Pane
@saylos
Feb 17 2017 10:44
Hi guys, I realy can't understand what's appening with this bootstrap navbar..pls have a look
https://codepen.io/saylos/pen/EZJwap?editors=1000
Ievgen
@myteststudy
Feb 17 2017 10:45
Hello everyone!
I'm working on an exercise: "Build a Random Quote Machine" (https://www.freecodecamp.com/challenges/build-a-random-quote-machine)
And I have a question: Where can I get JSON file, or how to create it to be available? How to make a link on him?
Kevin Holmes
@codersc
Feb 17 2017 10:54
@myteststudy one sec ill look up where i got mine
@myteststudy i got mine from http://quotesondesign.com
alpox
@alpox
Feb 17 2017 10:57
@ellenkorbes Your custom styles are ruining you again :-)
remove all .nav and .nav ul styles except the background-color for .nav
Ellen
@ellenkorbes
Feb 17 2017 10:58
@alpox Okay, lemme try.
alpox
@alpox
Feb 17 2017 10:59
@ellenkorbes Also, add nav-link to the a elements in the navigation list
@ellenkorbes For keeping the links right, add justify-content-end to the div which surrounds the ul. Then remove the mr-auto from the ul.
Ellen
@ellenkorbes
Feb 17 2017 11:02
@alpox Dayum. I dun got schooled, haha. You're the best. Thanks so much :D <3
CamperBot
@camperbot
Feb 17 2017 11:02
ellenkorbes sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 783 | @alpox |http://www.freecodecamp.com/alpox
alpox
@alpox
Feb 17 2017 11:03
@ellenkorbes You're welcome :-)
Ellen
@ellenkorbes
Feb 17 2017 11:03
Gonna spend a good few minutes trying to understand the whole thing now.
Tom Frenken
@Blackioo
Feb 17 2017 11:03
alpox back at it again, answering questions 24h/day :D
alpox
@alpox
Feb 17 2017 11:03
@Blackioo That happens when i'm bored :D
Tom Frenken
@Blackioo
Feb 17 2017 11:04
Got a question aswell :D - so first time I'll want to use a library outside of the tutorial in CodePen, how do I use this for instance? https://startbootstrap.com/template-overviews/scrolling-nav/
alpox
@alpox
Feb 17 2017 11:08
With codepen or without? @Blackioo
That one you cannot use so well inside of codepen :D
Well you can... download all the stuff and copy the content of the files to the right places in codepen.
If you want to work with it outside of that, just download and unzip
@Blackioo This is not really a library btw. its just a skeleton :D (Or boilerplate)
Clyde Lobo
@oppiniated
Feb 17 2017 11:15
@Blackioo Here, replicated it in codepen, http://codepen.io/clydelobo/pen/MJdYGj/
niprobin
@niprobin
Feb 17 2017 11:24
hey guys, my divs are losing their border-radius while hovering and zooming the img with transform: scale. Any idea how to solve that? The radius is there at the beginning and the end but not during the transition
alpox
@alpox
Feb 17 2017 11:26
@niprobin Can you show a pen?
Tom Frenken
@Blackioo
Feb 17 2017 11:33
uh was afk there @alpox and @oppiniated
thx anyways @alpox & @oppiniated
CamperBot
@camperbot
Feb 17 2017 11:34
blackioo sends brownie points to @alpox and @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 579 | @oppiniated |http://www.freecodecamp.com/oppiniated
:cookie: 784 | @alpox |http://www.freecodecamp.com/alpox
avazzz
@avazzz
Feb 17 2017 11:35
Hi! How to start making Build a Tribute Page. Show me the way
Nazar
@IsaakNazar
Feb 17 2017 11:37
Hi Guys, need some help
Clyde Lobo
@oppiniated
Feb 17 2017 11:37
@niprobin There's a bug with transform: scale and border-radius
alpox
@alpox
Feb 17 2017 11:37
@niprobin Thats a really strange behaviour ^^
him8710
@him8710
Feb 17 2017 11:38
hi . how send link tribute page? my page or code?
alpox
@alpox
Feb 17 2017 11:38
@niprobin Maybe you could use width and height instead of transform: scale
avazzz
@avazzz
Feb 17 2017 11:38
@him8710 Hi send me your tribute page code for listing
h1tag
@h1tag
Feb 17 2017 11:39
@avazzz what?
Nazar
@IsaakNazar
Feb 17 2017 11:42
need some help with my code
<div class="row">
    <div class="col-md-2">
      <a href="https://www.facebook.com/mers.vaneo" role="button" class="btn btn-reddit btn-large">
        <i class="fa fa-facebook-square" aria-hidden="true">
           Facebook
        </i>
      </a>        
    </div>
  </div>
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:43
What's wrong @IsaakNazar ?
Nazar
@IsaakNazar
Feb 17 2017 11:43
I want mu button to look like buttons on the https://icons8.com/ on the bottom of the page buttons (twitter, facebook etc)
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:44
include font-awesome
h1tag
@h1tag
Feb 17 2017 11:44
@him8710 copy the URL from the address bar
and submit that
him8710
@him8710
Feb 17 2017 11:45
ok thanks
Nazar
@IsaakNazar
Feb 17 2017 11:45
@NitinNair89 I've already include
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:46
what's the output you get ?
niprobin
@niprobin
Feb 17 2017 11:46
@oppiniated @alpox thanks will try with this
CamperBot
@camperbot
Feb 17 2017 11:46
niprobin sends brownie points to @oppiniated and @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 785 | @alpox |http://www.freecodecamp.com/alpox
:cookie: 580 | @oppiniated |http://www.freecodecamp.com/oppiniated
Nazar
@IsaakNazar
Feb 17 2017 11:46
@NitinNair89 only a link, not a button
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:48
do you have codepen?
Nazar
@IsaakNazar
Feb 17 2017 11:48
@NitinNair89 But I want a button link, not just a link
@NitinNair89 yeah. im coding my tribute
Marianissimus
@Marianissimus
Feb 17 2017 11:50
@niprobin did you solve that? I tried a possible workaround...
avazzz
@avazzz
Feb 17 2017 11:51
@NitinNair89 please help me in coding tribute page
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:51
@avazzz What help you need? @IsaakNazar Please share codepen link
Nazar
@IsaakNazar
Feb 17 2017 11:51
@NitinNair89
Marianissimus
@Marianissimus
Feb 17 2017 11:52
@niprobin with an outer div containing a transparent border, but it does like that: border-radius on default, border-radius on hover, but no border-radius during the transform itself. weird
Nazar
@IsaakNazar
Feb 17 2017 11:52
 <div class="row">
    <div class="col-md-2">
      <a href="https://www.facebook.com/mers.vaneo" role="button" class="btn btn-facebook btn-large">
        <i class="fa fa-facebook-square" aria-hidden="true">
           Facebook
        </i>
      </a>        
    </div>
  </div>
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:52
@IsaakNazar have you tried button group from Bootstrap?
Nazar
@IsaakNazar
Feb 17 2017 11:53
@NitinNair89 no, I havent
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 11:56
try that.
Eyej
@Eyej
Feb 17 2017 11:57
hi pls i am having trouble with my portfolio page
Marianissimus
@Marianissimus
Feb 17 2017 11:59
let us see @Eyej
Eyej
@Eyej
Feb 17 2017 12:07
aii do i drop my link here?
i want to put a box for my h1 text and buttons but its not working
Marianissimus
@Marianissimus
Feb 17 2017 12:09
@Eyej hey, add some dummy content first... the divs have no height or width, so they don't show
Millen812
@Millen812
Feb 17 2017 12:11
Any experienced wordpress devs around?
Eyej
@Eyej
Feb 17 2017 12:12
oh, ok thanks! @Marianissimus
CamperBot
@camperbot
Feb 17 2017 12:12
eyej sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
:cookie: 351 | @marianissimus |http://www.freecodecamp.com/marianissimus
Daniel
@Prezess
Feb 17 2017 12:15
I can't nest manu categories to right side...
I tried justify-content-end
also navbar-right
also float-right
and also on css .float-right {
float: right!important;
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 12:20
@Prezess try this in your css:
.navbar-nav > li > a {
  text-align: right;
}
Daniel
@Prezess
Feb 17 2017 12:21
still on left side...
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 12:23
I tried and it worked.
Daniel
@Prezess
Feb 17 2017 12:24
It works but when there is hamburger and text is on right side
but in normal view is still on left close with logo ...
Daniel
@Prezess
Feb 17 2017 12:32
I also tried pull-xs-right in ul
Ayush Bahuguna
@relentless-coder
Feb 17 2017 12:33
I have an image with transparent background, and I have to place a div on top of it, but the div is getting mixed with the background, I mean it too becomes transparent and I can see the image through it. Also, I am moving div with the help of negative top margin
Daniel
@Prezess
Feb 17 2017 12:34
@NitinNair89 can you try it on normal view ?
Nitin Chandran Nair
@NitinNair89
Feb 17 2017 12:34
trying.
@relentless-coder Did you set z-index for div?
zeddmacharia
@zeddmacharia
Feb 17 2017 12:39
i am workin on my first front end development project about dr.norman,the text-centre class for the h1 element and h2 element is not working.i also have a problem uploading the photo of dr.norman and the other biologists. id like to ask help from anyone who has gotten beyond this point..AM STUCK
Marianissimus
@Marianissimus
Feb 17 2017 12:40
@zeddmacharia show us your code / codepen...
vínαч puppαl
@vinaypuppal
Feb 17 2017 12:41
@Prezess try this
  • remove mr-auto class on ul and
  • add this css
    #mainNavigation {
    justify-content: flex-end;
    }
Ayush Bahuguna
@relentless-coder
Feb 17 2017 12:43
@NitinNair89 yes
zeddmacharia
@zeddmacharia
Feb 17 2017 12:45

@Marianissimus <div class="container fluid"

<h1 class="text-centre">Dr.Norman</h2>

<h2 class="text-centre">The man who saved a billion lives</h2>

@Marianissimus
Marianissimus
@Marianissimus
Feb 17 2017 12:46
did you close the div? @zeddmacharia also, if it's bootstrap, it should be "container-fluid"
vínαч puppαl
@vinaypuppal
Feb 17 2017 12:46
@relentless-coder for z-index to work div should also have position: relative or position: absolute
zeddmacharia
@zeddmacharia
Feb 17 2017 12:46
@Marianissimus yes i did
Marianissimus
@Marianissimus
Feb 17 2017 12:47
@zeddmacharia two separate names like "container fluid" mean two different classes (container + fluid). you need the hyphen
@zeddmacharia so try "container-fluid"
also, make sure that you correctly added bootstrap. you might also need jQuery for dropdown-navigations and others
zeddmacharia
@zeddmacharia
Feb 17 2017 12:48
that was a typing error,ive put container-fluid class and the heading still isn't moving to the centre
@Marianissimus wat is it that am doing wrong
Marianissimus
@Marianissimus
Feb 17 2017 12:49
you want what centered? the text inside h1 or the h1 and h2 inside the container?
zeddmacharia
@zeddmacharia
Feb 17 2017 12:50
i want the text inside the h1 and h2 element centred
@Marianissimus
@Marianissimus
@Marianissimus <h2 class="text-centre">The man who saved a billion lives</h2>
Marianissimus
@Marianissimus
Feb 17 2017 12:57
@zeddmacharia make sure you closed the div AND also correctly added bootstrap to your file. let's see the whole code, please
oh, hell, it's text-center, no text-centre @zeddmacharia LOL
zeddmacharia
@zeddmacharia
Feb 17 2017 13:04
@Marianissimus @Marianissimus @Marianissimus
Marianissimus
@Marianissimus
Feb 17 2017 13:08
yes, what's up? it was a typo all along... :)
zeddmacharia
@zeddmacharia
Feb 17 2017 13:09
@Marianissimus yes it was haha...thanx for the help
CamperBot
@camperbot
Feb 17 2017 13:09
zeddmacharia sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
:cookie: 352 | @marianissimus |http://www.freecodecamp.com/marianissimus
Marianissimus
@Marianissimus
Feb 17 2017 13:09
you're welcome
Eyej
@Eyej
Feb 17 2017 13:16
uhm, i'm a bit confused. How do i separate my buttons so they stay individually but on the same row and how do i add an image that has no web link?
pls can anyone assist me? i tried adding an image from my !G acc but it comes with the comments toohttp://codepen.io/Eyej/pen/xgNGWM
Vered Rekanati
@veredrec
Feb 17 2017 13:17
@Eyej you can add margin to each button so they are seperate but still on the same row.
use: button { margin-right or margin-left: Xpx; }
Eyej
@Eyej
Feb 17 2017 13:21
@veredrec ok, that works but the buttons are scattered. like i put them in the purple box div yet they appear almost outside the box
Vered Rekanati
@veredrec
Feb 17 2017 13:24
@Eyej I think that's because you have the width for the box but not for the buttons, so they take 100% width as defult. Try to change the width of the div that holds all the buttons. Does that make sense?
zeddmacharia
@zeddmacharia
Feb 17 2017 13:24
<div class="container-fluid">
<h3 class="text-center">Dr.Norman Borlaug</h3>
</div>
<h4 class="text-center">The man who saved a billion lives</h4>
<img scr="https://c2.staticflickr.com/4/3689/10613180113_fdf7bcd316_b.jpg">
</div>
@Marianissimu
the image is not being uploaded
Pawl Leonardo
@skybreak48
Feb 17 2017 13:32
Does anyone know how to center the unordered list for the Tribute Page? Mine is aligning to the left. Figured I would need to use the bootstrap grid, but I don't really know how.
kirbyedy
@kirbyedy
Feb 17 2017 13:32
@skybreak48
.solution li {
  list-style-position: inside;
}
Marianissimus
@Marianissimus
Feb 17 2017 13:34
@zeddmacharia this might because of flickr. did you try another photo and did it work?
kirbyedy
@kirbyedy
Feb 17 2017 13:34
@zeddmacharia note your spelling
<img scr=
it should be src
zeddmacharia
@zeddmacharia
Feb 17 2017 13:35
@kirbyedy oh another typing error thanx
CamperBot
@camperbot
Feb 17 2017 13:35
zeddmacharia sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1805 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Eyej
@Eyej
Feb 17 2017 13:36
@veredrec No, that dint work
Marianissimus
@Marianissimus
Feb 17 2017 13:36
oh, not again:) @kirbyedy @zeddmacharia I'm not even checking for spelling anymore, I just try to find code errors. @zeddmacharia try to copy-paste class names until you learn them by heart...
Eyej
@Eyej
Feb 17 2017 13:37
thanks tho @veredrec
CamperBot
@camperbot
Feb 17 2017 13:37
eyej sends brownie points to @veredrec :sparkles: :thumbsup: :sparkles:
:cookie: 284 | @veredrec |http://www.freecodecamp.com/veredrec
Vered Rekanati
@veredrec
Feb 17 2017 13:38
@Eyej I'm trying to find the solution :) just a second.
@Eyej You can change the margin that you add to the buttons to "margin-left" and make the margin a big bigger (let's say 20px) so it will move everything a little bit to the left.
r2d2
@UsamaHameed
Feb 17 2017 13:44
Hi, Can someone help me using jQuery in node.js?
zeddmacharia
@zeddmacharia
Feb 17 2017 13:46
<div class="container-fluid">
<div class="well col-xs-12">
<h3 class="text-center">Dr.Norman Borlaug</h3>
</div>
<h4 class="text-center">The man who saved a billion lives</h4>
<img class="img-responsive" src="https://c2.staticflickr.com/4/3689/10613180113_fdf7bcd316_b.jpg">
</div> @Marianissimus @kirbyedy how do i now make my image smaller
kirbyedy
@kirbyedy
Feb 17 2017 13:46
@zeddmacharia define a width
Pawl Leonardo
@skybreak48
Feb 17 2017 13:49

@kirbyedy that didn't work. It's like this, so far.

http://codepen.io/skybreak48/full/ggywEO/

kirbyedy
@kirbyedy
Feb 17 2017 13:50
@skybreak48 I dont see where did you apply that attribute I gave you ?
Pawl Leonardo
@skybreak48
Feb 17 2017 13:51
Oh.. did I take it out?
Where should I have put it?
kirbyedy
@kirbyedy
Feb 17 2017 13:52
<div class "col-xs-4 col-xs-8 col-xs-4">
what is this ?
Pawl Leonardo
@skybreak48
Feb 17 2017 13:52
I have no idea. I was trying something out.
Hahaha! :P
kirbyedy
@kirbyedy
Feb 17 2017 13:52
well... :)
Pawl Leonardo
@skybreak48
Feb 17 2017 13:53
It didn't really have any effect.
kirbyedy
@kirbyedy
Feb 17 2017 13:53
@skybreak48 you must be using it wrong then
take a look
Pawl Leonardo
@skybreak48
Feb 17 2017 13:54
So, to make it work, align center, and then list-style-position inside?
I'm gonna try it. :P
kirbyedy
@kirbyedy
Feb 17 2017 13:57
but honestly I wouldn`t bother with that, I would just put col-md-12 and finish with it :P
Nagireddy Srichakradhar Reddy
@srichakradhar
Feb 17 2017 13:58
I'm having a hard time getting a facebook user posts using the graph api
working with access tokens is really a pain
would someone like to pair on that?
Matthew Long
@MattLong87
Feb 17 2017 13:59
Can anyone see what I'm doing wrong here? Just starting on the quote generator project. Ignore the commented stuff, right now just trying to print "success" when the api call works https://codepen.io/MattLong87/pen/xgeBxK
kirbyedy
@kirbyedy
Feb 17 2017 14:00
@MattLong87 for start remove the S from your codepen link
start with http://
not https://
Matthew Long
@MattLong87
Feb 17 2017 14:00
wow, thank you.
thank you @kirbyedy
CamperBot
@camperbot
Feb 17 2017 14:01
mattlong87 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1807 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Pawl Leonardo
@skybreak48
Feb 17 2017 14:06
Aww Yiss!!! I did it by adding another <div class="col-md-2"></div> in the same row. :P
thanks @kirbyedy
CamperBot
@camperbot
Feb 17 2017 14:08
skybreak48 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1808 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Jonathan Lifschitz
@jonylif
Feb 17 2017 14:12
Hi everybody! I would like to switching to macbook pro for the first time, can anyone help me one sec to see if this macbook pro is good to my needs? I program and use photoshop, only that: https://www.bhphotovideo.com/c/product/1293728-REG/apple_mll42ll_a_13_3_macbook_pro_with.html
Matthew Long
@MattLong87
Feb 17 2017 14:13
Is there a way to explain why $("#newquote").on("click", getQuote); works but $("#newquote").on("click", getQuote()); doesn't?
kirbyedy
@kirbyedy
Feb 17 2017 14:15
@jonylif should do, yes
Jonathan Lifschitz
@jonylif
Feb 17 2017 14:15
@kirbyedy the viruses do not enter? never? the macbook is really really fast?
kirbyedy
@kirbyedy
Feb 17 2017 14:16
well if you are stubborn you can get a virus, but if you work normally, no viruses
yes mac is fast
the only problem I see there is a 13" screen
and you said you work with photoshop
depends on you, but I prefer big screen when working with rgaphics
minimum 21"
Jonathan Lifschitz
@jonylif
Feb 17 2017 14:18
this macboox dont have hdmi port?
kirbyedy
@kirbyedy
Feb 17 2017 14:19
as far as I can see its a new mac book pro, and they removed all the plugs
Marianissimus
@Marianissimus
Feb 17 2017 14:19
yeah, 13" will be a problem. I don't have enough display with a 24". And that's just for coding...
kirbyedy
@kirbyedy
Feb 17 2017 14:19
there are 2 usb-type C ports
Nazar
@IsaakNazar
Feb 17 2017 14:19
Hi Guys! Just finished my tribute project. Check it out
kirbyedy
@kirbyedy
Feb 17 2017 14:19
which means you have to get a converter to thunderbolt
Jonathan Lifschitz
@jonylif
Feb 17 2017 14:20
with a converter i can use a hdmi cable?
kirbyedy
@kirbyedy
Feb 17 2017 14:20
which means if you have an external hdd you should get a usb type-c hub
yes
Jonathan Lifschitz
@jonylif
Feb 17 2017 14:20
perfect! thankss
kirbyedy
@kirbyedy
Feb 17 2017 14:20
I think there are converters from usbtype-c to hdmi
keep in mind that with those macs, there is no upgrade later on, everything is soldered
not even a change of ssd hard drive
Matthew Long
@MattLong87
Feb 17 2017 14:23
@IsaakNazar looks great, only thing I notice is that the first picture doesn't scale down when you shrink the window'
Nazar
@IsaakNazar
Feb 17 2017 14:24
@MattLong87 could You suggest how can I fix that?
Matthew Long
@MattLong87
Feb 17 2017 14:25
@IsaakNazar i think the img-fluid bootstrap class will do it
Nazar
@IsaakNazar
Feb 17 2017 14:25
@MattLong87 thx I'll try this ))
CamperBot
@camperbot
Feb 17 2017 14:25
isaaknazar sends brownie points to @mattlong87 :sparkles: :thumbsup: :sparkles:
:cookie: 269 | @mattlong87 |http://www.freecodecamp.com/mattlong87
kirbyedy
@kirbyedy
Feb 17 2017 14:26
@MattLong87 you mean img-responsive :)
Matthew Long
@MattLong87
Feb 17 2017 14:27
@kirbyedy I thought so too at first but I found http://v4-alpha.getbootstrap.com/content/images/#responsive-images
i think it might be another new thing in bootstrap 4
kirbyedy
@kirbyedy
Feb 17 2017 14:28
oh crap, are they changing it again :)
Scharom
@scharom16
Feb 17 2017 14:28
hey floks i am at the js calculator challange should i use a tabel for the button arrangement or flexbox?
Matthew Long
@MattLong87
Feb 17 2017 14:28
i've been doing this for like 3 days and I'm already totally over bootstrap 4
Pawl Leonardo
@skybreak48
Feb 17 2017 14:32
Ooh.. I had the same problem. img-fluid did it.
kirbyedy
@kirbyedy
Feb 17 2017 14:33
@scharom16 avoid tables
Pawl Leonardo
@skybreak48
Feb 17 2017 14:33
thanks @MattLong87
CamperBot
@camperbot
Feb 17 2017 14:33
skybreak48 sends brownie points to @mattlong87 :sparkles: :thumbsup: :sparkles:
FL8Liew
@FL8Liew
Feb 17 2017 14:33
hey guys, i am currently doing random quote machine
how do i even get those quote??
CamperBot
@camperbot
Feb 17 2017 14:34
api offline
Matthew Long
@MattLong87
Feb 17 2017 14:34
@FL8Liew there are a couple of options, check out this thread https://www.reddit.com/r/FreeCodeCamp/comments/4b1fox/free_api_for_random_quote_machine/
FL8Liew
@FL8Liew
Feb 17 2017 14:36
@MattLong87 wow how do u even find this?
Matthew Long
@MattLong87
Feb 17 2017 14:36
@FL8Liew google, haha
@FL8Liew I searched for "random quote api"
FL8Liew
@FL8Liew
Feb 17 2017 14:37
@MattLong87 so which means i just need to put the code into the java part?
Nazar
@IsaakNazar
Feb 17 2017 14:41
.
Scharom
@scharom16
Feb 17 2017 14:41
@kirbyedy thanks
CamperBot
@camperbot
Feb 17 2017 14:41
scharom16 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1812 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Karl Uibo
@backsy
Feb 17 2017 14:43
javascript aint java
Matthew Bailin
@mdbailin
Feb 17 2017 14:48
hi there! can anyone help me with the minimax algo in the tic-tac-toe game? I've written it but there's a bug where I'm not able to set the score properly.
Matthew Bailin
@mdbailin
Feb 17 2017 14:54
hi there! can anyone help me with the minimax algo in the tic-tac-toe game? I've written it but there's a bug where I'm not able to set the score properly.
aenila
@aenila
Feb 17 2017 15:32
Morning everybody! Working on the javascript calculator. Having trouble centering the buttons and display vertically. Tried using the 'vertical-align: middle' property in a few different areas but doesn't seem to make a difference. Can anybody help?
Christopher Ryder
@cryder9898
Feb 17 2017 15:33
does anyone know if you can pass a parameter to setInterval method like this timer = setInterval(function() {countDown(time)}, delay);
@aenila you could use bootstrap rows and columns
aenila
@aenila
Feb 17 2017 15:35
I will give that a shot and see where it gets me. Thanks @cryder9898
CamperBot
@camperbot
Feb 17 2017 15:35
aenila sends brownie points to @cryder9898 :sparkles: :thumbsup: :sparkles:
:cookie: 301 | @cryder9898 |http://www.freecodecamp.com/cryder9898
Christopher Ryder
@cryder9898
Feb 17 2017 15:36
@aenila also bootstrap container class will center everything and make nice margins
Has anyone completed the pomodoro clock?
Matthew Bailin
@mdbailin
Feb 17 2017 15:45
@cryder9898 instead of defining an anon function in the setInterval block, you should write the function outside, then call the function
i.e. setInterval(myFunc,1000);
hi there! can anyone help me with the minimax algo in the tic-tac-toe game? I've written it but there's a bug where I'm not able to set the score properly.
achudoz
@achudoz
Feb 17 2017 15:47
hi, I have a strange problem. I am building the weather app and while the script that I made so far works on my phone (android/firefox), it does not work on either of my computers (ubuntu/firefox). I am puzzled as to why, wince other javascript websites work just fine including my previous pens. Can you see what is wrong with it?
http://codepen.io/achudoz/pen/bgJQLx?editors=1011
oh and on my computers, I cant even get the geolocation data or console.log checkpoints. Nothing works and I have no Idea why. It did work yesterday. Hello frustration my old friend.. :D
Matthew Bailin
@mdbailin
Feb 17 2017 15:55
hi there! can anyone help me with the minimax algo in the tic-tac-toe game? I've written it but there's a bug where I'm not able to set the score properly.
Gulsvi
@gulsvi
Feb 17 2017 16:24
@achudoz You'll need to find a way to get location over http to use openweathermap or find a weather api that supports https to use navigator.geolocation.
When I did my weather app, I used Dark Sky for the Weather API because it supports both HTTP and HTTPS. For location, I used navigator.geolocation and https://freegeoip.net/json as a fallback when navigator.geolocation didn't work.
Nazar
@IsaakNazar
Feb 17 2017 17:30
Guys could u reccomend some good html css JS editor?
Harish S
@hashris
Feb 17 2017 17:45
Try a bunch out and use whatever you're comfortable with. Sublime text is pretty good
Torian
@toriancrane
Feb 17 2017 17:45

Hello! I am working on my portfolio project and I am having an issue. Here is my project: http://codepen.io/toriancrane/pen/jyJJGR

The issue that I am having is that, under the Contact section where my social media icons are, whenever I try to turn those images into links, it warps that section of the page from looking like this https://gyazo.com/efc12a3aca76a8ecfd6d058e01bd87b9

to looking like this https://gyazo.com/217554347aebaef5c29efb070a4720b6

Does anyone know why this is happening?

Harish S
@hashris
Feb 17 2017 17:49
Above your contact section, you've declared this
"<a name="contact"</a>"
Torian
@toriancrane
Feb 17 2017 17:50
yeah for the navigation at the top
Harish S
@hashris
Feb 17 2017 17:50
@toriancrane This confuses the script below it
Its not closed right
<a name="contact"></a>
Torian
@toriancrane
Feb 17 2017 17:51
ahhhhh
okay @hashris thank you!
CamperBot
@camperbot
Feb 17 2017 17:51
toriancrane sends brownie points to @hashris :sparkles: :thumbsup: :sparkles:
:cookie: 84 | @hashris |http://www.freecodecamp.com/hashris
rasty42
@rasty42
Feb 17 2017 17:54
How does one accomplish the Portfolio Project without having learned any of the code used for it? Did I miss something? I swear all I did was hit next after every challenge. https://codepen.io/FreeCodeCamp/full/YqLyXB/.
Torian
@toriancrane
Feb 17 2017 17:55
@rasty42 I've found that it's been an ongoing process for me. I continued on through the other lessons/challenges and when I learned about something new would go back and figure out how to implement it
im only just now really about to check it off as completed and im about to start the jQuery section, so dont feel like you HAVE to do 100% of it before moving on
woops i meant the JSON APIS section
rasty42
@rasty42
Feb 17 2017 17:57
How do you move on? I try to click through the continues and it just cycles me back
Torian
@toriancrane
Feb 17 2017 17:57
if you go to your map
you can just click on the next one
Aaron
@apalm1341
Feb 17 2017 17:57
hey all
Torian
@toriancrane
Feb 17 2017 17:57
hey
Aaron
@apalm1341
Feb 17 2017 17:57
I am having issues setting my background image for my codepen project
Torian
@toriancrane
Feb 17 2017 17:58
what do you have so far @apalm1341
I looked into w3schools for guidance
and it looks like I did exactly what they did
so not sure what did wrong
rasty42
@rasty42
Feb 17 2017 17:58
@toriancrane Thank you.
CamperBot
@camperbot
Feb 17 2017 17:58
rasty42 sends brownie points to @toriancrane :sparkles: :thumbsup: :sparkles:
:cookie: 255 | @toriancrane |http://www.freecodecamp.com/toriancrane
Moisés Man
@moigithub
Feb 17 2017 17:59
@apalm1341 find another image .. /hosting server
Torian
@toriancrane
Feb 17 2017 17:59
agreed
rasty42
@rasty42
Feb 17 2017 17:59
That's really counter-intuitive and frustrating. I've had this issue with trying to use this and CodeAcademy. I just get to a point where it feels like I've been left waaaaaaaaaaaaaay behind and all I've done is follow instructions. Really kills my momentum.
Aaron
@apalm1341
Feb 17 2017 18:01
@moigithub hosting server as in another website ?
Torian
@toriancrane
Feb 17 2017 18:01
@rasty42 I do feel like that some of the topics can be scaffolded a bit better. if i had come into this with like 0 programming knowledge i think i would have struggled more than I have been. my advice is just to get comfortable with using outside sources to fill in the gaps. FCC is a great framework to get you going but sometimes you have to get a little more information on your own
Moisés Man
@moigithub
Feb 17 2017 18:01
https://www.lifewire.com/free-image-hosting-sites-3486329 @apalm1341
yep.. some websites to upload image files
if i recall imgur dont allow hotlinking neither
rasty42
@rasty42
Feb 17 2017 18:02
I do have 0 programming knowledge and I thought that was whole point of these sites was to help those with no previous knowledge. Oh well. I appreciate your time.
Aaron
@apalm1341
Feb 17 2017 18:03
@moigithub ok
will look into that
I forget how hotlinking works lol
it been awhile since I had to deal with that weird stuff
Torian
@toriancrane
Feb 17 2017 18:05
@rasty42 the projects are meant to be a way to get you to make connections with the topics they cover. It's true a lot of it is following their instructions, but you can always go back and reference a topic to see how you did something and then try to incorporate it into your project. If the information there is not enough, then Google some answers. It'll take some work, especially for people with 0 knowledge, that's all.
Scharom
@scharom16
Feb 17 2017 18:08
maybe I am too stupid to find it but is there a equal sign in font awesome?
Nazar
@IsaakNazar
Feb 17 2017 18:09
which one is better: Atom, Brackets or Sublime?
Scharom
@scharom16
Feb 17 2017 18:17
@IsaakNazar
in my opinion visual code
but there is no better or worse, there is just the editor you like to work with and the editor your employer dictates you to use :)
Sorin Ruse
@sorinr
Feb 17 2017 18:22
@IsaakNazar i've noticed that atom has some lag problems with css files having hundreds of lines
@IsaakNazar i've used all of them. sublime makes ME comfortable and this is what i use now
h1tag
@h1tag
Feb 17 2017 18:27
@sorinr Hi! :smile:
Sorin Ruse
@sorinr
Feb 17 2017 18:28
hi. been missing for a couple of days :)
h1tag
@h1tag
Feb 17 2017 18:29
I wanted to ask you about that, but I thought you were here at a different time than usual. Welcome back
Ruben
@Ruben-96
Feb 17 2017 18:30
What would be the best way to layout the page? Ive heard floats arent good for responsiveness, so what should i use? Flex box?
Im new at coding
Sorin Ruse
@sorinr
Feb 17 2017 18:33
@fortMaximus yea glad to be back
h1tag
@h1tag
Feb 17 2017 18:34
:smile: :+1:
Charlie Grimshaw
@Noobsicle123
Feb 17 2017 19:42
http://codepen.io/noobsicle123/pen/ggyjJj?editors=1100 why cant I jump to the social media id but I can jump to everything else?
niikaze
@niikaze
Feb 17 2017 19:57
the anchor link look fine, the thing is that id is at the bottom and there just isn't enough height to "properly" jump to it.
Dima Kushnir
@rinhsuk
Feb 17 2017 20:56
Hello. I need some help with jquery. How can I add a class to an element depending on elements that other div's have? http://codepen.io/dimasimply-1472290786/pen/PWvWRE/
Scharom
@scharom16
Feb 17 2017 21:03
hi I got a problem with my JSCalculator
when you zoom in and out and look at the button edges you can see there a kind of border or some other line-thing ... I removed every margin and border property form the buttons but it is still there..
How can I get rid of this?
Arash D
@ArashDai
Feb 17 2017 21:49
hey guys im building the local weather app, and im stuck on something ive done a million times
im trying to pass data into state and then render said data (using react)
i can properly pass things into state but i cannot access them
niprobin
@niprobin
Feb 17 2017 21:56
@Marianissimus Hey sorry I was not available, no I did not find a work around yet
Arash D
@ArashDai
Feb 17 2017 22:26
I think I hate codepen
sassy2807
@sassy2807
Feb 17 2017 22:30
Hey guys...I'm stuck on creating a thumbnail from codepen. I managed to get an image in there that will link to the page but its not technically a thumbnail of the site. I have been reading for days and cant figure it out...help?? This is what I have now : <p> <a href="http://codepen.io/sassy2807/full/LxeaEj/" target="_blank"><img src="http://www.opal-eyewear.com/sites/default/files/styles/field_marque_z1_photo/public/marque/main/ny_logo.jpg?itok=-NvwtzcZ" width="300" height="225" alt="Photo of White Beach in Boracay, Philippines" /></a>
I figured out how to embed...but again I dont think thats what im looking for
Eric
@ericsolomon21
Feb 17 2017 22:52
Can someone tell me why my getJSON()'s were working yesterday and now they aren't anymore? Both of these apps were working fine and I haven't changed anything. Is this something on codepen's side?
https://codepen.io/ericsolomon21/pen/GrvKZP
https://codepen.io/ericsolomon21/pen/NdgajG
Arash D
@ArashDai
Feb 17 2017 22:54
because codepen is a piece of crap
did you change from http to https ff the top of my head
codewarg
@codewarg
Feb 17 2017 22:54
hey every one, any other beginners on here that would like to put there knowledge into a collaborative project, i just got finish with the basic of html/css/js
Eric
@ericsolomon21
Feb 17 2017 22:57
@ArashDai I guess that fixed it. How can I make sure it opens back up in http instead of https?
Arash D
@ArashDai
Feb 17 2017 22:58
i mean if the request url has http in it it should open as http right?
correct me if im wrong
aimee-katherine
@aimee-katherine
Feb 17 2017 22:59
Hi everyone! Does anyone know how to use Font Awesome icons in Code Pen? My Font Awesome does not show up....is this a settings issue?
Arash D
@ArashDai
Feb 17 2017 23:00
im not sure, are you inking the stylesheet properly?
linking*
Eric
@ericsolomon21
Feb 17 2017 23:01
@ArashDai my request URLs are http, but the address bar in my browser had https. When I changed that to http, it worked. I guess it is just a code pen thing. Ill just make a default statment saying to remove the https and once they change it to http, it will be fixed.
aimee-katherine
@aimee-katherine
Feb 17 2017 23:01
@Noobsicle123 Seems to be jumping for me
Arash D
@ArashDai
Feb 17 2017 23:01
forsure sorry I couldnt be more help
if anyone could help me pass state i this react app I would love you forever
ive done it a milliontimes but today It wont worj
work*
aimee-katherine
@aimee-katherine
Feb 17 2017 23:05
@ArashDai That may be the problem...
Arash D
@ArashDai
Feb 17 2017 23:05
wooooo
its always the little things
spend 5 hours debugging? oh you missed a semi-colon
can someone help me, I feel my 6th gray hair growing in
Zack Richardson
@ZackRich12
Feb 17 2017 23:07
<button type="button" class="btn btn-link">
  <href url: "facebook.com">Facebook</a></button>

<h1>Webpage Design:</h1>
<h4>Showcasing What I Have Learned in FreeCodeCamp</h4>
anyone know why the link isnt going to facebook?
Arash D
@ArashDai
Feb 17 2017 23:07
url=
Zack Richardson
@ZackRich12
Feb 17 2017 23:07
no colon?
Arash D
@ArashDai
Feb 17 2017 23:07
not url:
also
Zack Richardson
@ZackRich12
Feb 17 2017 23:07
wow @ArashDai Thanks!
CamperBot
@camperbot
Feb 17 2017 23:07
zackrich12 sends brownie points to @arashdai :sparkles: :thumbsup: :sparkles:
:cookie: 155 | @arashdai |http://www.freecodecamp.com/arashdai
Arash D
@ArashDai
Feb 17 2017 23:07
nonono
waiiiiit
Zack Richardson
@ZackRich12
Feb 17 2017 23:07
okay
Arash D
@ArashDai
Feb 17 2017 23:08
its <a href='facebook.com'></a>
right?
well I guess I'll just sit here answering questions until I regain the strength to finish this project
Zack Richardson
@ZackRich12
Feb 17 2017 23:10
@ArashDai good, i'll need you lol
Arash D
@ArashDai
Feb 17 2017 23:10
lol
Zack Richardson
@ZackRich12
Feb 17 2017 23:10
<button type="button" class="btn btn-link">
  <a href = "http://facebook.com">Facebook</a></button>

<h1>Webpage Design:</h1>
<h4>Showcasing What I Have Learned in FreeCodeCamp</h4>
i tried this but it still doesn't go to facebook in codepen/ my code editor
@ArashDai
Phuc Le
@phuchle
Feb 17 2017 23:13
@ZackRich12 try https
aimee-katherine
@aimee-katherine
Feb 17 2017 23:13
@ZackRich12 Maybe try<a href="/" target="_blank"></a>
the blank
Arash D
@ArashDai
Feb 17 2017 23:14
can you wrap links like that?
Zack Richardson
@ZackRich12
Feb 17 2017 23:14
@aimee-katherine What do you mean?
Arash D
@ArashDai
Feb 17 2017 23:14
i think you want to wrap the button with the link
like <a><button><button><a>
aimee-katherine
@aimee-katherine
Feb 17 2017 23:16
@ZackRich12 If the problem is that Facebook isn't opening, I say try adding target="_blank" after Facebook.com"
Zack Richardson
@ZackRich12
Feb 17 2017 23:16
<a href = "http://facebook.com">Facebook
<button type="button" class="btn btn-link">
</button>
</a>
Arash D
@ArashDai
Feb 17 2017 23:16
did it work?
also
Zack Richardson
@ZackRich12
Feb 17 2017 23:16
nope
Arash D
@ArashDai
Feb 17 2017 23:17
you want to but the facebook between the button tags
hmm
Zack Richardson
@ZackRich12
Feb 17 2017 23:17
@ArashDai nevermind
here is what i got:
Facebook(button here with link that worked)
@ArashDai
Arash D
@ArashDai
Feb 17 2017 23:19
aimee was right set target to blank and it opens in a new tab
Zack Richardson
@ZackRich12
Feb 17 2017 23:20
Sorry, i am a noob. Target??? @ArashDai
Arash D
@ArashDai
Feb 17 2017 23:20
lol i dunno
RLD2121
@RLD2121
Feb 17 2017 23:20
Can someone help me with my header? Seems to not be in line and also the font wont turn green. Thank you!: http://codepen.io/RLD2121/pen/XpQOqx
Arash D
@ArashDai
Feb 17 2017 23:20
ive never had to use target
codepen is weird
I think im just going to have to make this project and deploy it on heroku so i can submit it
why is this so hard
Zack Richardson
@ZackRich12
Feb 17 2017 23:25
@ArashDai codepen acts very weird with links
Arash D
@ArashDai
Feb 17 2017 23:25
and react
it keeps throwing errors at me for no reason
every now and then it decides the spread operator (...) is an error even though im suing babel
using**
you know what
im done with codepen forever
Zack Richardson
@ZackRich12
Feb 17 2017 23:29
lol
@RLD2121 what do you want your header to be in line with?
Arash D
@ArashDai
Feb 17 2017 23:32
does removing container-fluid give the effect you want?
RLD2121
@RLD2121
Feb 17 2017 23:32
The list seems to not be aligned and also contains white side borders
Cool, I removed container-fluid and the white side borders went away. Thanks!
Arash D
@ArashDai
Feb 17 2017 23:33
haha!
be careful using container fluid
it should be on the most parent component
RLD2121
@RLD2121
Feb 17 2017 23:34
ya, im a noob and had no idea what it does
Arash D
@ArashDai
Feb 17 2017 23:34
its cool
weve all been there
RLD2121
@RLD2121
Feb 17 2017 23:34
do you happen to know why my list is not aligned?
The Rondel is higher that the other 3
than*
Arash D
@ArashDai
Feb 17 2017 23:35
hmm lemme see
give that line item the class pull left
...If only I could solve my own problems...
RLD2121
@RLD2121
Feb 17 2017 23:38
seems to stay the same
think it has anything to do with the bootstrap version im using?
Arash D
@ArashDai
Feb 17 2017 23:39
no
let try again it worked o my pc
something weird is going on here
RLD2121
@RLD2121
Feb 17 2017 23:41
ya
I tried it again and the "Contact" aligned with it but the rest remained at the bottom
lol
Arash D
@ArashDai
Feb 17 2017 23:42
I would take a look at the bootstrap nav documentation
i dont think you are using the classes properly
RLD2121
@RLD2121
Feb 17 2017 23:42
will do. thanks for your help man!
Arash D
@ArashDai
Feb 17 2017 23:42
because if you hover over the links
bubbles appear over the nav pills
micypici93
@micypici93
Feb 17 2017 23:43
222.png
3.png
1.png
Hello! I need help, I am stuck!
I need help with adding in cart, I called Web services products, and now function dodajProizvod () showing me the error cenaId is null .... I don't know how to fix....
If anyone understands me...
Arash D
@ArashDai
Feb 17 2017 23:44
I honestly dont think anyone here can help you with that
Moisés Man
@moigithub
Feb 17 2017 23:45
@RLD2121 ur closing <a> is wrong
micypici93
@micypici93
Feb 17 2017 23:45
ok, I tried: D
:D
Arash D
@ArashDai
Feb 17 2017 23:46
=/
sorry
RLD2121
@RLD2121
Feb 17 2017 23:48
@moigithub wow, I completely overlooked that....it works now...Thanks!
CamperBot
@camperbot
Feb 17 2017 23:48
rld2121 sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 2704 | @moigithub |http://www.freecodecamp.com/moigithub
micypici93
@micypici93
Feb 17 2017 23:49
@ArashDai :)
Arash D
@ArashDai
Feb 17 2017 23:51
you know the sad thing
like last week I made a way more advanced weateher app using thesame api
and now i cant make a more basic version
im just going to link that project and say im done
Gulsvi
@gulsvi
Feb 17 2017 23:57

@ZackRich12

<a class="btn btn-link" href="https://www.facebook.com" target="_blank">Facebook</a>

<button> is for submitting information.
<a> is for navigating to another location.
You can't have one wrapping the other.

Zack Richardson
@ZackRich12
Feb 17 2017 23:58
<a href="https://facebook.com"><button>Visit Page Now</button></a>
<a href="https://facebook.com"><button>Visit Page Now</button></a>
I finally figured it out, thanks thouhg! @SkyCoder01
CamperBot
@camperbot
Feb 17 2017 23:58
zackrich12 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 238 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Feb 17 2017 23:58
@ZackRich12 That is not valid HTML, so it may not work in all browsers. You can't have <button> inside <a> or <a> inside <button>
Zack Richardson
@ZackRich12
Feb 17 2017 23:59
@SkyCoder01 Why not?
Gulsvi
@gulsvi
Feb 17 2017 23:59
@ZackRich12 Because the HTML5 spec does not allow it