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

@MauriSg99 Add these CSS properties to your header:

  position: absolute;
  z-index: -1;
  width: 100%;

And take your text out of the <header> (or ideally, define a different element for your blurry background)

ACSlater8
@ACSlater8
im trying to move my objects but dont know how to properly move them using bootstrap
Gulsvi
@gulsvi
@ChrisAB74 Add navbar-fixed-top to your <ul> tag for your nav-pills:
<ul class="nav nav-pills nav-justified navbar-fixed-top">
Sunny Wong
@swong194
@ChrisAB74 set a high z-index
Gulsvi
@gulsvi
@ACSlater8 What objects are you trying to move?
ACSlater8
@ACSlater8
the <h> and the <p> on the second page
@SkyC0der im trying to get them further from the side and closer to covering the bubble
Veronica Eulenberg
@HappyViki
anyone know how to get the json wiki page to show up? I tried this: https://en.wikipedia.org/w/api.php?format=json&titles=India
Long Nguyen
@longnt80
@MauriSg99
header{
  height: 100vh;
  margin-top: -20px;
  margin-bottom:20px;
}

header .image{
  background-image:url(https://images.pexels.com/photos/7369/startup-photos.jpg?w=940&h=650&auto=compress&cs=tinysrgb);
  background-size: cover; 
  filter: blur(1px);
  -webkit-filter: blur(1px);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  width: 100%;
}
Gulsvi
@gulsvi
@ACSlater8 To move them down, you can use margin-top on the row that they're located in - give that row a class name and add margin-top in your CSS.
To move them left and right, play around with the size of the columns. For example, this makes the title and the text each take up 50% of the page width on md-sized screens and larger:
<div class="pageTwo">
  <div class="row">
    <div class="col-md-6 text-center">
      <h1>Slater Elkind</h1>
    </div>
    <div class="col-md-6">
      <p>Front-End Developer and UX/UI designer, with practical experience in project management, branding strategy, and creative direction; devoted to functional programming and information architecture.</p>
    </div>
  </div>
</div>
Mauricio Salas
@MauriSg99
@longnt80 Thaaaanks! That's exactly what I needed
ACSlater8
@ACSlater8
@SkyC0der Isn't it bad to use margin in css while using bootstrap. I was told that can affect the responsiveness of the program?
Gulsvi
@gulsvi
margin-top / margin-bottom is fine
left/right margins can mess things up, yes
ACSlater8
@ACSlater8
@SkyC0der and what about padding?
Gulsvi
@gulsvi
It's the same - left/right can mess things up with bootstrap.
Jarren
@Jarren5cent
Hello friends, I'm trying to learn how to make 2 gifs side by side, i'm not really sure what needs to be done, i'm trying "row" and col-md-4" right now.
https://codepen.io/Jarren5cent/pen/bRpxOQ
Gulsvi
@gulsvi
Responsive sites are based on screen width, not height
ACSlater8
@ACSlater8
ok
@SkyC0der so how would i move things left to right without messing it up
ChrisAB74
@ChrisAB74
Could I get some feedback. I finally got everything working the way it should.
https://s.codepen.io/ChrisAB74/debug/mwOMEd/XBrGRojDQvyM
ACSlater8
@ACSlater8
@SkyC0der i dont really understand the col command
Gulsvi
@gulsvi
@ACSlater8 Adjust the 6 in both of those col class names. The numbers have to add up to 12. So, use 3 and 9 or 5 and 7, etc.
a row has 12 columns - col-md-6 = 50% of a row.
(6/12)
Josh Beasley
@joshbeasley
I'm currently working on the Weather App, and encountered the https error and rewrote my geolocator to use the IP-API to get the latitude and longitude values. For some reason, the function is not obtaining the lat and lon characteristics of the object. Please help! Ive been stuck here for hours. https://codepen.io/joshbeasley/pen/rwWEmM?editors=1011
ACSlater8
@ACSlater8
@SkyC0der what would happen if i gave one md and the other sm?
Kaz Baig
@kbaig
@fullmetal7777 im here right now
Gulsvi
@gulsvi
col-md-6 means make it 6 columns (out of 12) on md-sized screens and bigger. Make it 12/12 on smaller screens.
So, 50% wide on md and bigger, 100% wide on smaller than md
@SkyC0der i moved it down but i still cant get it go over to the right
Jarren
@Jarren5cent
@SkyC0der thanks, I think you helped me out by answering @ACSlater8
CamperBot
@camperbot
jarren5cent sends brownie points to @skyc0der and @acslater8 :sparkles: :thumbsup: :sparkles:
:star2: 1746 | @skyc0der |http://www.freecodecamp.com/skyc0der
:warning: @acslater8's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
Gulsvi
@gulsvi
@ACSlater8 What is 8 + 9 ? :)
You can only have 12 columns inside a <div class="row">
@Jarren5cent happy to help lol
Jarren
@Jarren5cent
@SkyC0der think you can help me move my gifs up?
https://codepen.io/Jarren5cent/pen/bRpxOQ
Gulsvi
@gulsvi
@Jarren5cent Start by moving all of your inline styles into your CSS.
It's a lot of padding, absolute positioning, and widths + heights that are going to move things around
ACSlater8
@ACSlater8
@SkyC0der haha im sorry i know frustrating but i do appreciate the help
Jarren
@Jarren5cent
so css will help reduce that?
Gulsvi
@gulsvi
@ACSlater8 No worries, it can be hard to figure out at first
@Jarren5cent No, but it will help to see what's going on better - easier to debug/maintain.
Definitely don't mess with the width of items inside a bootstrap column
Jarren
@Jarren5cent
ok i'll try