# Container background image

**URL:** <https://forum.kirupa.com/t/container-background-image/328978>\
**Category:** web dev\
**Created:** [July 9, 2012, 1:41am UTC](https://forum.kirupa.com/t/container-background-image/328978 "2012-07-09T01:41:57Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![VaiFanatic](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/vaifanatic/32/7159_2.png) [@VaiFanatic](https://forum.kirupa.com/u/VaiFanatic)\
**Post date:** [July 9, 2012, 1:41am UTC](https://forum.kirupa.com/t/container-background-image/328978/1 "2012-07-09T01:41:57Z")

</div>

I’m attempting to set the background image to be fixed, so that way it’s all revealed to me without me having to expose it all with non-breakable spaces.

My intent is to fit all the information within this container without stretching the image, probably through the use of an opaque text box with a scrolling ability.

Here’s my initial code to get the image working:

```auto

.oneColFixCtrHdr #mainContent {
    padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    background: #000000;
    background-image:url(images/bg.jpg); background-repeat:no-repeat; max-height:100%;
    position:relative;
}

```