Struggling to get my image in the right place

Struggling to get my image in the right place
0

#1

Hi guys, I was wondering if I could get a little support in terms of placing my image. I’m trying to get it so my image scales dynamically to the screen size that I’m using to view it but also to get the image in the right place. I had my tribute page nice and complete(“using a 17” screen to view) and then opened it up on a 13" laptop and noticed it had gone to poop. Heres my codepen https://codepen.io/JohnnyTwins/pen/rrrqKL . on my screen theres a white gap at the right of the image. Many thanks in advance. x Peace


#2

Hi,

its this thats causing it

#monkey {
left: 10%
}

HTH

Mark


#3

I did have it had 0% right hoping that it would cause it to hug the right side of the div but it didn’t. Does 10% left not push it away from the left side? Thanks for the reply


#4

Hi,

Currently as 2 weeks on FCC. I know that there are 2 ways to make 2 column (left and right):

  • Use display:inline-block for the div. (manually sizing and may trouble with small screen)
  • User Grid of Bootstrap (it help easy to response in mobile too).
    Just google to Bootstrap grid & W3C for CSS ref. I struggled like you last week and sometime get stuck. But I learn a lot by researched to find the way.