Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Jun 19 20:09
    @krisb1220 banned @Gastony
  • May 14 22:39
    @bjorno43 banned @minitechtips_twitter
  • May 14 22:38
    @bjorno43 banned @real-action
  • Feb 01 00:27
    @bjorno43 banned @Ndoua
  • Jan 07 03:10
    @bjorno43 banned @doctor-sam
  • Aug 17 2019 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 2019 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 2019 17:13
    @mstellaluna banned @cmal
  • Jan 08 2019 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
korzo
@korzo
@JenniferEstelle It looks ok
Jennifer Estelle Bedford
@JenniferEstelle
Nevermind, I see what I did... sorry!
Eric Hasegawa
@EricHasegawa
Can anyone tell me how I can make the image links only take up the size of the image, rather than the whole block of the screen? https://codepen.io/erichasegawa/pen/YxMJOa
korzo
@korzo
@EricHasegawa Your images have display: block with margin: auto so they take whole screen width
Eric Hasegawa
@EricHasegawa
@korzo That makes sense, how can I center them while having their display: inline?
korzo
@korzo
@EricHasegawa give img display:inline-block and parent of <a> text-align: center
Eric Hasegawa
@EricHasegawa
@korzo Thanks! I figured it out
CamperBot
@camperbot
erichasegawa sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 550 | @korzo |http://www.freecodecamp.com/korzo
Chris
@bestintown23
@lydatech your the goat thanks
CamperBot
@camperbot
bestintown23 sends brownie points to @lydatech :sparkles: :thumbsup: :sparkles:
:star2: 2476 | @lydatech |http://www.freecodecamp.com/lydatech
Zerka1982
@Zerka1982
Hello Guys
Could you please look at this and tell me why I do have a white space in the bottom of the page ?
I'm trying to make it responsive ....
What do you think I'm doing wrong ?
LydaTech
@lydatech
@bestintown23 goat?
legendinraze
@legendinraze
how do use an image from my own PC as a background
I*
piteto
@piteto
@lydatech Greatest Of All Time (GOAT)
@legendinraze You'll need to upload it somewhere like your github repo, cloudinary, postimage, etc
Zerka1982
@Zerka1982
@legendinraze First you must know the image location and then you ll add in CSS file ,
body {
background: url(../images/picture-name.jpg) no-repeat 50% 50%;
background-size: cover;
display: table;
position: relative;
}
@piteto Could you please check this https://codepen.io/Zerka1982/pen/WZjQbj
piteto
@piteto
I'm looking at it now @Zerka1982 computer is doing ten things, so dev tools are taking a while to load :joy:
Zerka1982
@Zerka1982
Alright, thanks dude. The issue I'm having is the bottom of the page is white while I'm trying to have the background image covering the whole page....
piteto
@piteto
your background images aren't loading - pixabay doesn't let you link directly to their site
Zerka1982
@Zerka1982
it s ok dude, just put an image your self :)
and check the result. Look at the bottom of the page and see
I checked one website to see if the page is responsive and got this
image.png
As you see the bottom of the page is white :(
piteto
@piteto
It's your .gb-logo class pushing it down
Zerka1982
@Zerka1982
so what should i do ?
piteto
@piteto
It's hard to tell because I don't know what you want to do next with your website
change the min-height setting on your .gb-logo class for now
also change the min-height on your .top class
You are using a lot of position: relative instead of relying on the normal document flow
@Zerka1982
piteto
@piteto
It 185 lines of CSS, so based on what you want to do next, there may be better options
Zerka1982
@Zerka1982
Alright, I ll look at it , thank you very much :)
piteto
@piteto

I'd start with changing stuff like this:

  position: relative;
  top: 20px;
  left: 30px;

to:

margin-top: 20px;
margin-left: 30px;
absolute and relative positions should not be used for your form position
Zerka1982
@Zerka1982
Good point
Anything else I must take into consideration ???
piteto
@piteto

@Zerka1982 I haven't had time to give a good review, but here's something that caught my eye:

  border: none; /* <-- This thing here */
  border: solid 2px #fff;

border is defined twice

maybe use more meaningful class names - "cover" and "part1", "part2" don't describe the content very well
leftInput and rightInput are good names
Zerka1982
@Zerka1982
Good point