# Center oversized website background

**URL:** <https://forum.kirupa.com/t/center-oversized-website-background/265390>\
**Category:** Uncategorized\
**Created:** [July 8, 2008, 1:54pm UTC](https://forum.kirupa.com/t/center-oversized-website-background/265390 "2008-07-08T13:54:10Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![2nd\_day](https://avatars.discourse-cdn.com/v4/letter/2/a4c791/32.png) [@2nd\_day](https://forum.kirupa.com/u/2nd_day)\
**Post date:** [July 8, 2008, 1:54pm UTC](https://forum.kirupa.com/t/center-oversized-website-background/265390/1 "2008-07-08T13:54:10Z")

</div>

Hi guys,

I’ve designed a website in Photoshop which I obviously want to convert to a real website. I’ve done this a lot of times before, so that isnt the problem. The problem is that the background of the website is very big (as in broad, big width). Its about 1400px big. Now the problem is that when you have a smaller resolution (1280 \* 800 for instance) the image ‘starts’ in the left top… So the right part of the image isnt visible. Now my question is how to center a to big image so that the blocked part of the image is at the left as well as the right side…

I hope I made my problem clear…

---

<div class="post-metadata">

**Author:** ![pixelSnobbery](https://avatars.discourse-cdn.com/v4/letter/p/e274bd/32.png) [@pixelSnobbery](https://forum.kirupa.com/u/pixelSnobbery)\
**Post date:** [July 8, 2008, 2:09pm UTC](https://forum.kirupa.com/t/center-oversized-website-background/265390/2 "2008-07-08T14:09:29Z")

</div>

```auto
body {
	background-image:url(untitled-1.jpg);

	background-position:center top;
}

```

^ That should do it! 🙂

---

<div class="post-metadata">

**Author:** ![redelite](https://avatars.discourse-cdn.com/v4/letter/r/dc4da7/32.png) [@redelite](https://forum.kirupa.com/u/redelite)\
**Post date:** [July 8, 2008, 2:09pm UTC](https://forum.kirupa.com/t/center-oversized-website-background/265390/3 "2008-07-08T14:09:51Z")

</div>

If your looking to scale the image to ‘fit’, you won’t be able to do this. However, if you just want it centered then you can go with this in your css:

```auto

background: url(path/to/image.gif) no-repeat top center;

```

- ^ 😛 beat me to it and you have your positions backwards…

---

<div class="post-metadata">

**Author:** ![2nd\_day](https://avatars.discourse-cdn.com/v4/letter/2/a4c791/32.png) [@2nd\_day](https://forum.kirupa.com/u/2nd_day)\
**Post date:** [July 8, 2008, 2:13pm UTC](https://forum.kirupa.com/t/center-oversized-website-background/265390/4 "2008-07-08T14:13:16Z")

</div>

Thanks guys! It works!