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
Gulsvi
@gulsvi
5vh = 5% the height of your window
Andrew Hickman
@ahickman3
@SkyC0der i do understand that part, ive done a little research on em and rem to atleast understand how they work, but its changing the view in relation to different elements thats confusing me.
@SkyC0der I think i may have figure it out. my background picture actually going above the viewport, but i guess its still technically in html? so the top of the page is farther up than the viewport? im not sure. Bottom with vh works but top with vh does not work as id expect it
@fullmetal7777 basically with top: #vh its acting like the page goes higher than can actually be viewed
Gulsvi
@gulsvi
@fullmetal7777 I'm not sure what you're looking at :) but if you can show me what's going on, I can try and help explain it better
Andrew Hickman
@ahickman3
@SkyC0der codepen messes up my view completely, but i can atleast put my code in there and you can throw it on your ide and view it? sorry for the trouble lol
@fullmetal7777 so bascially, bottom: #vh under .scuba-text works as you would think, but top: #vh does not
Gulsvi
@gulsvi
@fullmetal7777 Codepen is "messing up your code" because you aren't using the settings correctly.
Andrew Hickman
@ahickman3
@fullmetal7777 i have no clue why codepen fudged up the view so much, but it looks fine when i open it through chrome, also all the images are getting from urls. Here the code on a website im hosting http://andrewsawesomesite.com/
Ejikemeuwa Eric Nnanna
@melete90
Hi guys, <div class="jumbotron"></div> doesn't work. please what do I do?
Gulsvi
@gulsvi

All of this:

<script src="https://use.fontawesome.com/717f3e0b5b.js"></script>
<link rel="stylesheet" href="main.css">
<link href='https://fonts.googleapis.com/css?family=Cinzel|Alegreya SC' rel='stylesheet'>
<link href='https://fonts.googleapis.com/css?family=Cinzel' rel='stylesheet'>

<html>
    <head>
        <title>Tribute to My Father</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>

Needs to go in the settings section

Andrew Hickman
@ahickman3
@SkyC0der It loads correctly on the website though? Seems to be codepen to me, but maybe im missing something
@SkyC0der id trust it working on chrome than codepen lol
Gulsvi
@gulsvi
@fullmetal7777 codepen's HTML panel should only have the stuff between your <body> tags.
everything else goes in settings - then it will work like anywhere else
Andrew Hickman
@ahickman3
@SkyC0der ahh im sure there was a reason, i just had no clue. Sorry about that, never knew that lol
Gulsvi
@gulsvi
Plus, I'm not sure how your website is working elsewhere when you have fonts and stylesheets defined outside of your <html> tags
JD Tadlock
@jdtdesigns
@fullmetal7777 You should also avoid the use of floats these days. Flexbox's support is strong ;)
Gulsvi
@gulsvi
@fullmetal7777 Set it up this way for starters and see if you're noticing the same behavior: https://codepen.io/skycoder/pen/RgbKLq?editors=1000
Andrew Hickman
@ahickman3
@SkyC0der i took off the scripts in the html and still no change :/ also i linked them correctly in the settings first. I always figured you linked everything outside of the html tag. See, these are the important things that i need to be learning, so thank you lol
CamperBot
@camperbot
fullmetal7777 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1575 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
@fullmetal7777 This is a good reference: https://github.com/joshbuchea/HEAD
Andrew Hickman
@ahickman3
@jdtdesigns which part do yo umean by floats?
Ejikemeuwa Eric Nnanna
@melete90
<div class="jumbotron"></div> does not work on my computer, what do i do?
PipsChips
@PipsChips
Gulsvi
@gulsvi
And, yeah, as long as you don't care about Internet Explorer, you can use flexbox and ditch the floats. Otherwise, it gets messy.
Think JD's referring to:
#nav-head-text{
    float: left;
    margin: 1px 0 0 0;
}
PipsChips
@PipsChips
@SkyC0der
srry, this one is the last version:
https://codepen.io/PipsChips/pen/XpYvdm
Andrew Hickman
@ahickman3
@SkyC0der so removie the head, html and body tag? is that the only changes you made? aside from adding all the external links in the settings, which i did
Gulsvi
@gulsvi
@fullmetal7777 And I put your <script> at the very bottom of the HTML panel
@PipsChips Everything must use HTTPS now in codepen - your HTTPS proxy is blocked because it's ultimately going through a HTTP endpoint.
PipsChips
@PipsChips
I've changed the http-image with a htttps-animation, and tried to get json using https://crossorigin.me/ as an url's prefix
Andrew Hickman
@ahickman3
@SkyC0der what i would set the display to flex and use margin to move the div objects?
Gulsvi
@gulsvi
Mixed Content: The page at 'https://s.codepen.io/PipsChips/pen/XpYvdm?editors=0010' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?......'. This request has been blocked; the content must be served over HTTPS.
@fullmetal7777 You would use flexbox justify-content I believe: https://css-tricks.com/almanac/properties/j/justify-content/
@PipsChips The only fix for your weather app is to host it on a different server or use a different Weather API that supports HTTPS for free (like Dark Sky)
Andrew Hickman
@ahickman3
@SkyC0der okie doke, i fixed that, lemme re-upload my stuff, one sec.
PipsChips
@PipsChips
@SkyC0der
ok, thnx. gonna try that site
CamperBot
@camperbot
pipschips sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1576 | @skyc0der |http://www.freecodecamp.com/skyc0der
JD Tadlock
@jdtdesigns
Here's some global stats for browser usage. Unless your site is directed towards an older clientele, there's no reason to support ie 10 and below. IE11 supports flexbox with prefixes. http://gs.statcounter.com/
Gulsvi
@gulsvi
@PipsChips Good luck :+1: this is a pain for many people right now :(
Andrew Hickman
@ahickman3
@SkyC0der https://codepen.io/fullmetal7777/pen/bWzegK things are atleast showing up now, but still trash view lol http://andrewsawesomesite.com/ is what it should look like
@SkyC0der i think its not showing that first background images. I had a lot of trouble getting images to show up on codepen until i eventually just gave up on it
@SkyC0der i used like 4 different image hosting website and still nothing
Gulsvi
@gulsvi
@fullmetal7777 with class names like this <li class="nav-links">, are you supposed to have bootstrap in your project? Or just using the same class names?
Andrew Hickman
@ahickman3
@SkyC0der no bootstrap, wanted to do this all without it so i could learn as much as possible. Id say worth it so far though, i have learned a lot. Want to try to get the responsive design solo on the first shot
@SkyC0der its just coincidence, i didnt even know that was a class name on bootstrap lol