Я пытался создать сайт со следующей структурой:
желаемая структура http://i50.tinypic.com/vhw076.png

Но я не могу, кажется, получить правильный заголовок (e1 слева, e2 по центру, e3 справа). Я хочу, чтобы три элемента e1, e2 и e3 были расположены слева, посередине и справа. Вот что я пытаюсь:

<div id="wrapper">
<div id="header">
    <div id="header-e1">
        1
    </div>
    <div id="header-e2">
        2
    </div>
    <div id="header-e3">
        3
    </div>
</div>
<div id="nav">
    links
</div>
<div id="content">
    content
</div>
<div id="footer">
    footer
</div>
</div>

С этим CSS:

#wrapper
{
    width: 95%;
    margin: 20px auto;
    border: 1px solid black;
}

#header
{
    margin: 5px;
}
#header-e1
{
    float: left;
    border: 1px solid black;
}
#header-e2
{
    float: left;
    border: 1px solid black;
}
#header-e3
{

    border: 1px solid black;
}

#nav
{
    margin: 5px;
}
#content
{
    margin: 5px;
}
#footer
{
    margin: 5px;
}

Can someone give me tips to what I can do? The structure is going to be used on a mobile website.

ОБНОВИТЬ

Код, который я имею выше, дает мне это: текущий результат http://i46.tinypic.com/2mg87ya.png Но я хочу, чтобы 2 центрировались, а 3 - справа. Я не хочу устанавливать ширину в процентах, потому что содержание в элементах может варьироваться, то есть это может быть 20/60/20 - 10/80/10 - 33/33/33 или что-то еще.