These are chat archives for FreeCodeCamp/Help

16th
Nov 2017
Chris
@bestintown23
Nov 16 2017 00:09
help, i am trying to add a section to my page to display my prices for work, problem is if you look at the page, where is says"the cost" is way off to the right of the page but i need it to be on the left. https://codepen.io/bestintown23/pen/bYoqrO
Claudio Restifo
@Marmiz
Nov 16 2017 02:33

@bestintown23 Din't know if you meant to load additional CSS with it but i have a 404 on iCHservices.css.

That said have you tried giving the parent div the display:flex property?
probably something like:

display: flex;
width: 100%

And then work with the individual flex position of the h1 and h2?

I added this for instance to try to replicate the feeling of your page:
.cost {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
}
Momozor
@momozor
Nov 16 2017 08:41
Hello
Marc
@MWBauer
Nov 16 2017 14:07
Morning! :wave: :coffee:
Ken Haduch
@khaduch
Nov 16 2017 14:37
where is everyone this morning?
good morning @MWBauer - very quiet room this morning.
how are you doing today?
Kaz Baig
@kbaig
Nov 16 2017 14:41
Busy Thursday mornings
Trying to work hard so that we can goof off on Friday :)
Ken Haduch
@khaduch
Nov 16 2017 15:22
@kbaig :)
周兴睿
@wahx5249
Nov 16 2017 15:35
Hello every one
I have some question...
Kaz Baig
@kbaig
Nov 16 2017 15:51
Ask and somebody will get to it if they can :) @wahx5249
周兴睿
@wahx5249
Nov 16 2017 15:55
Thank you so much and I’ve got it😘
SuperGeniusZeb
@SuperGeniusZeb
Nov 16 2017 16:05

I was going through https://www.freecodecamp.org/challenges/get-set-for-our-front-end-development-projects and I ran into what could be something outdated on the website. On step 6, it tells you to add Bootstrap to the pen, and that adding the text-primary class will cause the text to change color. I tried that, but nothing happened. I tried using both Bootstrap 3 or Bootstrap 4, and I tried refreshing the page and looking at it in both Firefox Nightly & Chromium.

Here's what I have in the HTML part of the pen:
<h1 class="text-primary">Hello World</h1>

And that's it. Nothing in the CSS or JS parts.

I checked, and it doesn't look like the Bootstrap library is loaded at all. I used the "HTML Analyzer" feature of CodePen and it gave me this warning:

The classes container (1) col-xs-4 (2) text-primary (2) btn (2) btn-primary (2) are used in the HTML but not found in any stylesheet.

(I later changed the HTML to include all this)
<div class="container"> <div class="col-xs-4"> <h1 class="text-primary">Hello World</h1> <button class="btn btn-primary">Press me!</button> </div> <div class="col-xs-4"> <h1 class="text-primary">Hello World</h1> <button class="btn btn-primary">Press me!</button> </div> </div>
Kaz Baig
@kbaig
Nov 16 2017 16:10
@SuperGeniusZeb can you link the pen
I guess I should have done that first. XD
Kaz Baig
@kbaig
Nov 16 2017 16:12
@SuperGeniusZeb yeah that's weird. Add jQuery above Bootstrap
that solves it
jquery can also be found in the drop down
SuperGeniusZeb
@SuperGeniusZeb
Nov 16 2017 16:16
That doesn't seem to work for me. I made sure to put it above Bootstrap, and again, I tried switching between Bootstrap 3 & 4, and viewing it in both Firefox Nightly & Chromium.
Kaz Baig
@kbaig
Nov 16 2017 16:19
@SuperGeniusZeb it's not throwing an error in the console now
Sorin Ruse
@sorinr
Nov 16 2017 16:19
@SuperGeniusZeb pen settings->css add bootstap3
Kaz Baig
@kbaig
Nov 16 2017 16:19
But it's still not applying nvm lol
oh yeah lol
I don't use bootstrap sorry haha
SuperGeniusZeb
@SuperGeniusZeb
Nov 16 2017 16:20
Yep, that works. Thanks, @sorinr !
CamperBot
@camperbot
Nov 16 2017 16:20
supergeniuszeb sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1360 | @sorinr |http://www.freecodecamp.org/sorinr
Sorin Ruse
@sorinr
Nov 16 2017 16:21
@SuperGeniusZeb welcome
SuperGeniusZeb
@SuperGeniusZeb
Nov 16 2017 17:04
Hmmm... I just realized that while Bootstrap 3 is working, Bootstrap 4 isn't, or at least not entirely. The columns work, but the styling for buttons and text colors aren't.
https://codepen.io/SuperGeniusZeb/pen/ooGOWB
Any idea why those aren't working?
Chris
@bestintown23
Nov 16 2017 17:20
how can i make my icons and figcaptions show in a row instead of a column on my page? https://codepen.io/bestintown23/pen/bYoqrO
Darren
@DarrenfJ
Nov 16 2017 17:26

@gishy1 for which exercise? (been afk since midday yesterday)

@DarrenfJ bro i had to look at youtube tutorials and i felt so bad doing it by the way why cant you use a for loop instead of a while loop ?

morning fCC!
Darren
@DarrenfJ
Nov 16 2017 17:45
@kbaig that from the P1xt thing? man, yer rawking them well done
Kyle Holm
@thekholm80
Nov 16 2017 17:45
@DarrenfJ :wave:
Darren
@DarrenfJ
Nov 16 2017 17:45
@thekholm80 hey buddy! :D
what's up in your world?
Kyle Holm
@thekholm80
Nov 16 2017 17:45
playing video games
you?
Darren
@DarrenfJ
Nov 16 2017 17:46
well done!
@bestintown23 you talking bout the light bulb and computer screen and checkered flags?
@bestintown23 this article suggests either floating one of the divs (in the case of 2) or having them as display:inline-block ; https://stackoverflow.com/questions/5803023/how-to-place-two-divs-next-to-each-other
@thekholm80 ah i liked the other answer better ;)
Kyle Holm
@thekholm80
Nov 16 2017 17:50
@DarrenfJ lol i want to avoid misunderstandings
Darren
@DarrenfJ
Nov 16 2017 17:52
in my late evenings I am replaying skyrim on my old Xbox360 to see if i can finally finish all the sub threads i wasn't that interested in the first time, and do the daedra and other shrine challenges, some of which i just stumbled upon when i played it the fist (first two hundred) time(s)
Kyle Holm
@thekholm80
Nov 16 2017 17:52
they're releasing skyrim in VR
pretty exciting
Darren
@DarrenfJ
Nov 16 2017 17:53
that would be interesting but i can imagine the lag would just make everyone fighting dragons le vomee
Kyle Holm
@thekholm80
Nov 16 2017 17:53
i think they've got it nailed
everything i've read about it, and fallout 4 VR (same engine) has been super positive
Chris
@bestintown23
Nov 16 2017 18:16
@DarrenfJ Yes i am talking about that.
@DarrenfJ I am currently using this article
Darren
@DarrenfJ
Nov 16 2017 18:24
@thekholm80 falout 4 is on VR!!?? dang
i havnen't even played it in 2D yet!! ;)
@bestintown23 coolCool looks like you'll get it figured out :D
TBH I want something in the black marshes next... @thekholm80
Kaz Baig
@kbaig
Nov 16 2017 18:33
@DarrenfJ yeah dude thanks :D
CamperBot
@camperbot
Nov 16 2017 18:33
kbaig sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2275 | @darrenfj |http://www.freecodecamp.org/darrenfj
Darren
@DarrenfJ
Nov 16 2017 18:49
was checking someone's portfolio for fCC and their CodePen went to a 404 but man I just noticed this little gem hidden in the top right corner:
image.png
Darren
@DarrenfJ
Nov 16 2017 18:54
@thekholm80 thanks for the chat
CamperBot
@camperbot
Nov 16 2017 18:54
:star2: 1593 | @thekholm80 |http://www.freecodecamp.org/thekholm80
darrenfj sends brownie points to @thekholm80 :sparkles: :thumbsup: :sparkles:
DarrenfJ @DarrenfJ goes back to testing
Chris
@bestintown23
Nov 16 2017 19:11
why is 2 out of 3 of my divs showing in a row? nothing seems to work for me... i need them all in a row https://codepen.io/bestintown23/pen/bYoqrO
SuperGeniusZeb
@SuperGeniusZeb
Nov 16 2017 21:51

I figured out the problem with Bootstrap 4 on CodePen. Their Bootstrap 4 CSS include is the wrong file. They use the link to the grid component (https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta.2/css/bootstrap-grid.css), not the entire Bootstrap library. (https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css)

Hope that info is helpful to anyone else doing stuff on CodePen using Bootstrap 4.

Ken Haduch
@khaduch
Nov 16 2017 21:57
@SuperGeniusZeb - thanks for posting that. I noticed that that was the version that was being supplied by the quick link, but I didn't go far enough into trying to use it to see that it was not correct.
looks like camperbot is not recognizing my thanks @SuperGeniusZeb - I manually pasted a link into the external CSS resource boxes...
CamperBot
@camperbot
Nov 16 2017 22:00
khaduch sends brownie points to @supergeniuszeb :sparkles: :thumbsup: :sparkles:
api offline
Henry
@GitHub-Henry
Nov 16 2017 22:08
@SuperGeniusZeb @khaduch i've had similar issues in the past, offering a solution, i've bookmarked, https://cdnjs.com/, so i can quickly pull in exactly what i want. i found assuming to be a waste of time
Ken Haduch
@khaduch
Nov 16 2017 22:11
@GitHub-Henry - well, you just get too comfortable using the CodePen shortcuts, so it's a good idea to invest a little more in understanding the setup and requirements. It's unfortunate that there aren't more lessons in the freeCodeCamp curriculum to give that info. I guess my gut told me when I saw bootstrap-grid that it wasn't correct, and I went to the source to get the proper file. Good tip, though, to be more aware of the environment! thanks!
CamperBot
@camperbot
Nov 16 2017 22:11
khaduch sends brownie points to @github-henry :sparkles: :thumbsup: :sparkles:
:cookie: 485 | @github-henry |http://www.freecodecamp.org/github-henry