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
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS yeah in the first image, no bootstrap dosent deal with resizing image
@TOMEJUS set bacground-size to cover
Tomas
@TOMEJUS
No change :(
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS set the width of img to 100% and height to auto and set overflow of parent container to hidden
Tomas
@TOMEJUS
@AkashKumarVerma but image has nothing to do with, right? so it won't make any difference, correct me if i am wrong, but if'll put text instead of img i'll still have empty spaces (which are column). What I need is a way to somehow select only what is inside it, not whole column, and I hvn't found that yet, if i try to create a wrap it gets the same dimensions as col-xs-4.
blob
Akash Kumar Verma
@AkashKumarVerma

@TOMEJUS sorry i din't get ehat you are trying to say.
since there is no height and width set for img tag it will scale to fit the image inside the parent div, and since the image is taller than it is wider it will have gaps on both the side. Now when we set img width to 100% it's width is set to that of the parent container and on setting background-size to cover the image is stretched to cover the entire width of the img element. Now since image is taller then wider when the image will be scaled to fit the img element it will get taller then the parent element and will flow out of it, to prevent that we set the parent element overflow to hidden.

Hope you got it

Sorin Ruse
@sorinr
@TOMEJUS why don't you just add that padding: 0 to #section3 .col-xs-4 in order to have the imgs fill your xs-4 column? ofc not working for the first img coz it have 100px by 100px as it is now
Tomas
@TOMEJUS
@AkashKumarVerma it makes no sense to add width to a img since it is responsive, also, if I add width 100% it totally messes img. :(
@sorinr padding does not change anything in this case, unfortunetely :(
blob
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS this is the reason i dont like frameworks
Tomas
@TOMEJUS
IT would work perfectly if id put very big images so it won't have any space to overflow (which example I exactly saw), however if somehow I could manage to put that image into wrapper which are same dimensions as image then it would work as well, but unfor i believe im over my head and im doing something wrong :(
@AkashKumarVerma haha i feel you, this is the first time im working with bootstrap, so I guess i don't know any secrets where I could find a workaround around this
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS they are messy, it's in their code abstracting something too much creates problems that we cant even se
e
Ajay Tanwar
@ajayt365
hey can anyone help with html units ? rem,em,px ?
Tomas
@TOMEJUS
@ajayt365 we'll try!
Ajay Tanwar
@ajayt365
should i use px or rem ? when shoud i use em etc. ?
Tomas
@TOMEJUS
@ajayt365 as far as I know, px is the best measure to use, however there are cases when others are better to use.
@ajayt365 so if i were you I would stick with px's for times sake
Akash Kumar Verma
@AkashKumarVerma
@ajayt365 read this http://thenewcode.com/775/Which-CSS-Measurements-To-Use-When
Ajay Tanwar
@ajayt365
see i made this https://ajayt365.github.io/js30/playSound/ page and whenever i switch to responsive design by devtools , it kind of leaves blank grey space at the bottom what could be the reason ?
is it because i am using px ?
Sorin Ruse
@sorinr
@TOMEJUS how do you see this pen excepting first img?
Akash Kumar Verma
@AkashKumarVerma
@ajayt365 because your page is not responsive, The page width is exceeding the viewport width and scrollbar is being added to view content
Sorin Ruse
@sorinr
@TOMEJUS btw. what kind of monitor are you using?
Tomas
@TOMEJUS
@sorinr
blob
Sorin Ruse
@sorinr
@TOMEJUS it is possible that on my laptop display to look ok but on a bigger normal monitor to look like the blob above
Tomas
@TOMEJUS
@sorinr full HD (1920px)
@sorinr Its a laptop as well
sennator
@sennator2
http://codepen.io/sennator/full/OWNjKE/
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS you will have to use fixed height for section3
Tomas
@TOMEJUS
@AkashKumarVerma but the height is alright, isn't it? its just the wideness, right? Im getting lost.
sennator
@sennator2
How to make my div in which quotes are displayed responsive to the size of quote?
Akash Kumar Verma
@AkashKumarVerma

@sennator2 set

min-height: 70%; and max-height: auto;

also add
.new-quote { cursor: pointer; } it will be more user friendly

Sorin Ruse
@sorinr
@TOMEJUS thats strange. i don't know what to say. with that padding: 0 for me its removing that teal background
Tomas
@TOMEJUS
@sorinr Yeah, I've spent 3 hours already trying to fix that, but i've came to conclusions that its impossible
sennator
@sennator2
@AkashKumarVerma thanks man
CamperBot
@camperbot
sennator2 sends brownie points to @akashkumarverma :sparkles: :thumbsup: :sparkles:
:cookie: 280 | @akashkumarverma |http://www.freecodecamp.com/akashkumarverma
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS those are not paddings that is you image beiing added to fit the container vertically. Do what i said and set the section3 height to some value
sennator
@sennator2
what a great community this is
Akash Kumar Verma
@AkashKumarVerma
@sennator2 welcome
@sennator2 here to help each other
Tomas
@TOMEJUS
@AkashKumarVerma As I said, even if it would help it looses its responsiveness (just tried) so its no use in any case, but thanks for help. Or im clearly missing something, by any chance could you edit that pen?
CamperBot
@camperbot
tomejus sends brownie points to @akashkumarverma :sparkles: :thumbsup: :sparkles:
:cookie: 281 | @akashkumarverma |http://www.freecodecamp.com/akashkumarverma
Akash Kumar Verma
@AkashKumarVerma
@TOMEJUS fixing the heigth wont affect the responsiveness much if you want to try