Please help with Thumbnail on my first project

1

I am building my first page, and I am pretty happy with it for my first page but I can’t figure out how to make the image full width and responsive within my thumbnail, it that make sense.
I must have done something wrong as it was fine before but can’t find the issue right now.
any idea?

1 Like
2

You have on html defined width=100%. It should be a : as in width:100%. Although it’d be easier to see if you move your style to the css :slight_smile:

3

HI,
thanks for your feedback. SO fixed this issue and move it to the css as :
img {
width:100%;
margin:auto;
}
but it is still the same :confused:

4

I am currently trying to find the solution chris

5

Chris since your using bootstrap it is just using its rules over yours, so what I did was just made an id called picture on both the div and the img element, and set that id to width of 100% like this:

<div class="img-thumbnail" id="picture">
      <img id="picture" src="http://www.lesfilmsengloutis.com/wp-content/forum/uploads/2015/09/thumb-naughty-boy.jpg"  alt="Guillaume nery Runnin' Lose it all">

#picture {
  margin: auto;
  width: 100%;
}
6

When you mean responsive with your thumbnail, you mean you want the font-size to reduce too with when you reduce the screen?
for that you could set the font-size to a percentage.

7

Chris what I posted will work on your website

1 Like
8

Thanks I have tried this before but it sill does now work as you can see now, I am so confused :slight_smile:

9

hooo ok I see
i got it, sorry about that
thanks a lot it works

1 Like
10

I meant i want the picture to resize by itsel on mibile, smaller window…
but it it all good now, thanks :slight_smile: