Переместить меню вправо влево?

Question

Я хочу переместить правое меню в левую сторону, проблема в том, что я не могу изменить все HTML, я должен сделать это с помощью CSS.Шаблон HTML выглядит следующим образом:

<style type="text/css">
#all{background:gray;width:400px}
#content{
 background:yellow;width:300px;
 position:absolute;
 margin-left:100px;
 float:left;
}
#menu{background:red;width:100px}
#footer{background:green}
</style>

<div id="all">
    <div id="content">
    Content<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    </div>

    <div id="menu">
    Menu<br/>Menu<br/>Menu<br/>Menu<br/>Menu<br/>Menu<br/>
    </div>

    <div id="footer">
    Footer
    </div>
</div>

Это работает ... НО, если содержимое длиннее (по высоте), чем меню, оно переходит в нижний колонтитул.

Я хочу установить нижний колонтитул внизу, он должен «прикрепляться» к #menu и #content.Я мог бы решить эту проблему, переставив HTML внутри шаблона, чтобы переместить меню в начало (и немного изменить CSS), но я не могу изменить HTML.

спасибо за любые идеи:)

Answer 1

Не совсем уверен, что вам нужно здесь (ваша фраза немного странная, что такое "присоединить"?), Но наиболее часто используемый метод - просто float их в ту сторону, которая вам нужна, например:

#all{
    background: gray;
    width:400px;
}
#content{
    background:yellow;
    width:300px;
    float: right;
}
#menu{
    background:red;
    width:100px;
    float: left;
}
#footer{
    background:green;
    clear: both;
}

См .: http://www.jsfiddle.net/yijiang/4Rxky/