Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Toni Shortsleeve
@KoniKodes
@mhdavis Trying placing your viewport meta tags inside the html settings.
@VaseJS Thank you for your help! :-)
Michael Davis
@mhdavis
@KoniKodes sorry, could you explain what you mean?
Toni Shortsleeve
@KoniKodes
@mhdavis On codepen, you have add the bootstrap for css, but it needs something like this <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" /> if the html settings so that it knows to resize everything to the viewport size. Under stuff for head. Also, your header links should be placed into the css settings as additional stylesheets, and not in the html coding. This is only true for codepen.
Michael Davis
@mhdavis
@KoniKodes so do you suggest putting the navbar content and such into a header instead of the body and moving any links referenced in the html to the css conected with those elements?
also I'm not super familiar with fixing the <meta> so I guess i should google that to see what sort of things its responsible for in the html
it seems like from what you are suggesting it mainly affects how elements on the page fit depending on the device loading the page
Toni Shortsleeve
@KoniKodes
@mhdavis No, that's is not necessary. try this for the nav: <body data-spy="scroll" data-target=".navbar" data-offset="0">
<!-- navigation --> Yes, exactly - the page is resizable with bootstrap help, but you need to size according to viewport - so it's better to add it (in the meta tag). Google viewport and resize, see if that helps.
Michael Davis
@mhdavis
So are you suggesting i add this to the meta line? should i tweak these settings in any particular ways?
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
also adding stuff you suggested to the body made it so as I scroll down the page, the particular sectiont that im on in the page is highlighted in the navbar, which is pretty neat
Tyler Moeller
@TylerMoeller

@mhdavis Instead of push, use offset instead:

        <div class="col-md-2 col-md-offset-1">
          <img class="smaller-image" id="profile-pic" src="https://pbs.twimg.com/profile_images/611301315264839681/43NNwpaH.jpg" alt="Picture of Me">
        </div>

        <div class="col-md-7 col-md-offset-2" id="jumb-info">

Adjust the top and bottom margins of your profile picture to position it correctly on smaller screen sizes.

Toni Shortsleeve
@KoniKodes
@mhdavis Yes, especially the scales and width / height. This tells it to scale down to fit. Allowing the user to control the scale is optional.
Michael Davis
@mhdavis
@TylerMoeller I swapped out the push for offsets. on the backend does that adjust the cols without creating more space internally with the cols? also it pushed the id="jumbo-info" portion further from the round img, can this be fixed by playing with the padding?
Tyler Moeller
@TylerMoeller
@mhdavis It has the same effect as adding an empty column before the content. If you want less space between the image and the text, change the offset to 1:
<div class="col-md-8 col-md-offset-1" id="jumb-info">
Michael Davis
@mhdavis
@KoniKodes as for the <link> elements, how do i put them into the css?
@KoniKodes I also included the <meta> line but am not sure on how to tweak the settings to make sure things are working properly
@TylerMoeller yea that works perfectly, the problem i still run into tho is if you decrease the width of the page, the bottom social media buttons still clip out from the jumbotron section
@TylerMoeller likewise, decreasing the page width also results in the lettering "designs built from first principles" overlaping a little with the image
p.s. @TylerMoeller and @KoniKodes thanks for taking the time really appreciate it!
CamperBot
@camperbot
:cookie: 849 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
mhdavis sends brownie points to @tylermoeller and @konikodes :sparkles: :thumbsup: :sparkles:
:cookie: 376 | @konikodes |http://www.freecodecamp.com/konikodes
Tyler Moeller
@TylerMoeller
@mhdavis Yeah, you'll need to adjust the top and bottom margins of your profile picture to prevent that from happening.
This message was deleted
Michael Davis
@mhdavis
@TylerMoeller i tweaked the margin-bottom on the picture so now the social media buttons stay in the jumbtron frame
but for some reason tweaking the margin-right doesn't seem to change the spacing on the lettering to the right of the picture
tichusp
@tichusp
fun stuff
tfw I spend the past 30 minutes wondering why my newbie react app is not working and trying all sort of debugging only to find out that I was using module.exports like this "module.exports(MyModule)" instead of this "module.exports = MyModule"
Michael Davis
@mhdavis
@KoniKodes is there a way to change the css on ```
<body data-spy="scroll" data-target=".navbar" data-offset="0">
so that the color isn't grey persay
Salomon
@zarruk

http://codepen.io/zarruk/pen/jrByJq?editors=0010

why is my getjson giving me an array instead of a json, anybody knows?

vínαч puppαl
@vinaypuppal
This message was deleted
This message was deleted
Salomon
@zarruk
my final url would be https://crossorigin.me/https://en.wikipedia.org/w/api.php?action=opensearch&search=" + myVar + "&format=json&callback=?", right?
vínαч puppαl
@vinaypuppal
@zarruk :+1:
Salomon
@zarruk
@vinaypuppal it still gives me an array. i dont see the difference :smile:
vínαч puppαl
@vinaypuppal
@zarruk oh okay i understood it wrong and yes you will get array only not object from API
Salomon
@zarruk
@vinaypuppal ah ok, thats fine. just wanted to confirm im not doing it wrong
thanks :)
vínαч puppαl
@vinaypuppal
@zarruk and inside that array the second element contains descriptions of word you searched for so use them to show in your UI
Salomon
@zarruk
yes, that is what i was going to do :)
Tyler Moeller
@TylerMoeller
@mhdavis You'll need to modify the #jumb-info css to move the text further to the right
Margaret
@Margaret2
@tichusp Yes I know that feeling! 😂😂
tichusp
@tichusp
:D
Ron Laniado
@ronlaniado
Any suggestions about this navBar?
Omar Salem
@OmarSalem563
@ronlaniado wat is the run pen
Ron Laniado
@ronlaniado
@OmarSalem563 you need to click run pen to see what navBar
Michael Davis
@mhdavis
@ronlaniado one suggestion i would make is when it becomes small enough, you change the tabs to a dropdown menu