Link to home
Create AccountLog in
Avatar of altariamx2003
altariamx2003Flag for Mexico

asked on

how to resize an image changing the size resolution of the page

I found this pages: http://www.altaour.com and http://www.fiftythree.com/paper

If you change the size resolution of your browser you will see that the the image remains in the center.

And also if you increase the size resolution of your browser you will see new parts of the same image

I would like to know how to do that to my page.
Avatar of Kyle Hamilton
Kyle Hamilton
Flag of United States of America image

it's a background image with centered positioning.

something like this:

.container{

   background:url(big-image.jpg) center center no-repeat;
   width:100%;
}
Avatar of altariamx2003

ASKER

I tried that but the background image remains in the same place no matter what wich resolution I use

check this:

resolution: 1920x1080
User generated image

resolution: 1280x720
User generated image
as you can see with the lower resolution the background image remains in the center of the screen


I would like to do something like that
could this workk???

.container{
   background : url(big-image.jpg) no-repeat fixed center center transparent;
   
   width:100%;

}

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Kyle Hamilton
Kyle Hamilton
Flag of United States of America image

Link to home
membership
Create an account to see this answer
Signing up is free. No credit card required.
Create Account
it works!!

thanks!!!