CSS background-size cover and background-position

html css background-image
Ivo picture Ivo · Dec 18, 2012 · Viewed 81.7k times · Source

HTML:

I'm using a images as a background image, only the lower part of the image is more important than the top.

How can I make the background go up a little?

Answer

Stéphane Bruckert picture Stéphane Bruckert · Dec 18, 2012

If the bottom is more important: background-position: bottom;

background-position also allows percentage values: 0% 0%; by default.

The first value is the horizontal position and the second value is the vertical. The top left corner is 0% 0%. The right bottom corner is 100% 100%. If you only specify one value, the other value will be 50%.

You should try background-position: 0% -10%;

Related questions

CSS Display an Image Resized and Cropped

I want to show an image from an URL with a certain width and height even if it has a different size ratio. So I want to resize (maintaining the ratio) and then cut the image to the size I …

Read More
How to completely remove borders from HTML table

My goal is to make an HTML page that is similar to a "photo frame". In other words, I want to make a blank page that is surrounded by 4 pictures. This is my code: <table> <tr> &…

Read More
Fit background image to div

I have a background image in the following div, but the image gets cut off: <div style='text-align:center;background-image: url(/media/img_1_bg.jpg);background-repeat:no-repeat;width:450px;height:900px;' id="mainpage" align="center"> Is there …

Read More