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

@zootechdrum

Setting the top, right, bottom, and left properties of a relatively-positioned element will cause it to be adjusted away from its normal position. Other content will not be adjusted to fit into any gap left by the element.

So, what's happening here is that the image with the .faceprofile class is taking up that space because it is set to position: relative. The quick fix is to do what @sjames1958gm recommends.

You could also make figcaption have a relative position and change the .faceprofile to absolute position instead of adjusting the bottom margin
.profile1 figcaption {
  position: relative;
}

.profile1 .faceProfile {
  position: absolute;
  border-radius: 50%;
  max-width: 90px;
  opacity: 1;
  bottom: 100px;
  left: 25px;
}
zootechdrum
@zootechdrum
@gulsvi @sjames1958gm thanks so much. guys. I really appreciate it.
CamperBot
@camperbot
zootechdrum sends brownie points to @gulsvi and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2694 | @gulsvi |http://www.freecodecamp.org/gulsvi
:star2: 9148 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Ghost
@ghost~55a04b725e0d51bd787af54c
hi
Is anyone on?
Dhaval Vira
@dhavalveera
Hi
guys why is data.stream undefined?
Frosty427
@Frosty427
image.png
how would i make this div take up the other half of the page?
like a left and right kind of thing
the light blue is taking up 50% of the page and i need the darkblue to do the same
kerafyrm02
@kerafyrm02
hi ppl. who needs help?
Dhaval Vira
@dhavalveera
for which purpose
kerafyrm02
@kerafyrm02
idk any?
Dhaval Vira
@dhavalveera
you are Expert in Front-End ?
kerafyrm02
@kerafyrm02
JS / CSS?
yeah
pretty good anyways
kerafyrm02
@kerafyrm02
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="styles.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">
      <script defer src="https://use.fontawesome.com/releases/v5.0.9/js/all.js" integrity="sha384-8iPTk2s/jMVj81dnzb/iFR2sdA7u06vHJyyLlAd4snFpCl/SnyUjRrbdJsw1pGIl" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class="left-right-container">
    <div class="lef-haf">
      <p class="items"><i class="fas fa-search icons"></i>Follow your interests.</p>
       <p class="items"><i class="fas fa-users icons"></i>Hear What people are talking about.</p>
      <p class="items"><i class="far fa-comment icons"></i>Join the conversation.</p>
    </div>


    <div class="rit-haf">
      <input type="text" name="" value="">
    </div>
    </div>
  </body>
</html>



@font-face {
  font-family: Segoe UI; src: url('Sego UI.ttf');

}
body {
  margin: 0;
  font-family: 'Segoe UI', Arial, sans-serif;
  font-weight: 700;

}

.left-right-container {
  display: flex;
}

.lef-haf {
  width: 50%;
  display: flex;
  background: rgb(29, 161, 242);
  font-size: 18px;
  color: white;
  justify-content: center;
  /* flex-wrap: wrap; */
  align-content: center;
  flex-direction: column;
  height: 100vh;

}





.items {
margin-left: 150px;

}

.icons {
  margin-right: 10px;
}


.rit-haf {
  /* position: relative;
  width: 50%;
  left: 50%; */
  width: 50%;
  height: 100vh;
  background-color: #1b2836;
  color: white;

}
There's your answer frosty
Anyone else need help
Dhaval Vira
@dhavalveera
@kerafyrm02 pls message me directly
coderNewby
@coderNewby
@darrenfj thanks
CamperBot
@camperbot
codernewby sends brownie points to @darrenfj :sparkles: :thumbsup: :sparkles:
:star2: 2443 | @darrenfj |http://www.freecodecamp.org/darrenfj
Federico Dente
@fez994
Hello guys i need help with javascript, can someone help me?
Sweet Coding :)
@SweetCodingInc
@fez994 post your question
Federico Dente
@fez994

$.getJSON(url, function(data) {

    var lat = data.results[0].geometry.location.lat;
    var lon = data.results[0].geometry.location.lng;

    //console.log(lat);
    });
How can i make the lat and lon variables accessible outside of the $.getJSON function?
@SweetCodingInc
Sweet Coding :)
@SweetCodingInc
@fez994 okay.. create a new fucntion and pass these values to that function..
$.getJSON(url, function(data) {
  var lat = data.results[0].geometry.location.lat;
  var lon = data.results[0].geometry.location.lng;

  useLatLon(lat, lon);
});

function useLatLon(lat, lon){
  // use them here
}
Federico Dente
@fez994
@SweetCodingInc Alright it works thank you
CamperBot
@camperbot
fez994 sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 394 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Federico Dente
@fez994
@SweetCodingInc Do you know how can i make those variables global instead of using them for a function? The problem is that i'm using the google API to get lat and lon based on address, then i use this coordinates to call a second Api wich shows solar radiations data
But doing so i get "No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access."
Sweet Coding :)
@SweetCodingInc
@fez994 Do you have codepen for this?
@fez994 As for making lat and lon variables global, it's straightforward
var lat, lon;
$.getJSON(url, function(data) {
  lat = data.results[0].geometry.location.lat;
  lon = data.results[0].geometry.location.lng;

  useLatLon(lat, lon);
});

function useLatLon(lat, lon){
  // use them here
}
Federico Dente
@fez994
I'll post it on codepen but i'll remove the api keys
Sweet Coding :)
@SweetCodingInc
@fez994 did you try adding ?callback=? at the end of your 2nd api url? (after the api key)
Federico Dente
@fez994
no
Sweet Coding :)
@SweetCodingInc
try it see if that works
otherwise, you will have to read their docs and set appropriate headers
Federico Dente
@fez994
image.png
Got this error now
Sweet Coding :)
@SweetCodingInc
@fez994 sorry.. my bad.. you need to add &callback=?
I didn't notice you already had query parameters