Image in src goes to background-image and does not resize

1

I am putting together a project for a friend of mine and I am using the scrolling page that divides the page into parts. In the first part I am putting a banner and a writing with the logo of my friend.

The problem is that when I put the normal logo, such as 'img src="link"' in HTML, at the time of the preview I notice that it exits the image and goes to the bottom in background-image . Although I put it right it is not going and it gets the image cropped.

HTML:

<img id="logo" src="assets/img/logo.png">

CSS:

#logo {
 width: 300;
 height: 180px;
}

But the sizes (width and height) that I can move both in CSS and HTML are just the size of the area or space that the image is (as if it were a div), I can not move the size of the image itself. When the size decreases, the image is cropped.

Example with CSS above, image appears cropped:

In red, missing parts

Chrome code and analysis on the page Code and Analytics

Has anyone ever had a similar problem?

Link: link

    
asked by anonymous 06.12.2017 / 15:57

1 answer

0

Puts in percentage to see if it works. Example:

#logo {
 width: 60%;
 height: 50%;
}

Remember to test the sizes there, it will not necessarily be 100% or 50%.

    
06.12.2017 / 16:51