CSS Bottom Positioning - html

Question

So, I have this:
.cmon
{
background-repeat: repeat-x;
background-image: url("line2.png");
position:absolute;
bottom:0px;
}
What it should do, is put the image (line in this case) on the bottom of the page, from what I understand, and repeat it. It does put it on the bottom, but doesn't repeat, anybody knows what's my problem?
This is how it looks like when the code is on:
http://goolag.pw/temptest.html
Also, in the menu (top right corner) the image doesn't even show up, nor does is it on the bottom.
I will be more than happy if anybody knows whats the problem.
(sorry if links are not allowed here, there are no commercials on the web, it's really just to show what's the problem)

Answer 1

To position background images you should use the background-position property:
.cmon {
background-repeat: repeat-x;
background-image: url("line2.png");
background-position: bottom;
}
The background-position CSS property sets the initial position, relative to the background position layer defined by background-origin for each defined background image.
You'll need to ensure your element has some height and width, however, as background images are not content and do not affect the size of the element.

Answer 2

So first, your problem is not only about CSS but HTML too. You have to attach your attribute .cmon on another tag like <span>, <p>or even <div>.
<div class="cmon"></div>
Then for your CSS :
.cmon {
background-repeat: repeat-x;
background-image: url("line2.png");
position: absolute;
bottom: 0px;
left: 0px; right: 0px; // For having a full width bar
z-index: 999999; // Will be always visible, even when the menu is showed up
height: 4px; // attribute the height of your image
}
Hope this help you.
Ps : Don't forget to use HTML5 !