CODEWITHSUNDEEP
htmlcss
JohnB47
JohnB47

Reputation: 3

I can't get a background image size to change

I'm very new to HTML and CSS. I'm using a book called The Missing Manual, CSS3 and I'm stuck on changing the size of an image that I want to use as a background. To help isolate the problem, I made up simple HTML and CSS files, but I still can't get the background-size property to actually do anything. The image shows OK and I can change the repeat, but no matter what I put for background-size (% or px) the size of the image never changes (bigger or smaller). I've tried also changing the image to a PNG, but still a no-go. The sprial.jpg image size is 292x288 px - so 'small' that I may not use it in the end.

I'm using Notepad++ to write the code and Chrome to view it.

body {
  background-image: url(https://cdn.pixabay.com/photo/2017/09/08/21/39/spiral-2730290__180.jpg);
  background-repeat: no-repeat;
  background-size;
  50% 50%;
}
<body>
  <p> Hello
  </p>
</body>

Upvotes: 0

Views: 1043

Answers (2)

Stijn Westerhof
Stijn Westerhof

Reputation: 243

The problem is the semicolon, you write background-size; instead of background-size:.

Upvotes: 3

Stefano Saitta
Stefano Saitta

Reputation: 2024

There is a typo on

backgroud-size: 50% 50%;

This should work fine.

NOTE: You should add some plugin that helps you with this kind of simples syntax error. For instance this one: Css Explorer

Upvotes: 1

Related Questions