spread ordered list over the full length of the window

[jens1701]

Hello everybody,

i tried to build a footer... i thought something like this:

<ol class="siteInfo">
<li>©2007 Jens |</li>
<li>Last Changed 21.10.2007 |</li>
<li><a>Impressum</a> |</li>
<li><a>Site Map</a></li>
</ol>

1. It should be glued to the bottom of the page
2. It shall use the whole width of the page, or a individual width
3. the list items should be equally distributed over the width.
4. this have to be dynamic as the length of last changed is variable.

my try:

/*4. Side Info ********************************************** */
.siteInfo {
	background: #ffccff;
	position: fixed;
	bottom: 2px;
	width: 100%;
	max-width: 845px;
	padding-left: 190px;
	
}
.siteInfo li {
	background: #ccccff;
	display: inline;
	width: 25%;
	
}

As you can see the distibution over the length is not working.
So is such a distribution possible at all, if yes what did i do wrong?

Greets

Jens

[Fang]

.siteInfo li {
    text-align:center;
    float:left;
    background: #ccccff;
    display: block;
    width: 25%;
}

[jens1701]

Hi Fang,

thx for the help!

I'm nearly there!

Through setting the list items to float they now ignoring the max-width set in .siteInfo... Keeping in mind that right will not work, as the space to the right window border has to be variable...
How do i limit the width now?

Greets

Jens

[jens1701]

Hi,

problem solved!
Had computed the width the wrong way!
max-width = padding - width

so i had to substract 190 from my 845.

.siteInfo {
	background: #ffccff;
	position: fixed;
	bottom: 2px;
	width: 100%;
	max-width: 845px;
	padding-left: 190px;
	
}

cu

Jens

[jens1701]

i mean:

max-width = width - padding