html - HTML/CSS：根据屏幕尺寸调整元素，无需 JavaScript

Question

我有以下默认的 html 2 列方案：

<div id="page">
    <div id="header"></div>
    <div id="left"> sidebar stuff</div>
    <div id="right">
        <div id="topbar">
            <div id="menu">
                <ul>
                    <li><a href="#">A</li>
                    <li>B</li>
                    <li>C</li>
                </ul>            
                <div id="iconmenu">
                    <button>a</button>
                    <button>b</button>
                    <button>c</button>
                    <button>d</button>
                </div>

            </div>
            <div id="content">
                <div style="border: 1px solid black; height:400px">content</div>
            </div>
        </div>
    </div>
</div>

见：http: //jsfiddle.net/K9K8b/1/

我想让图标栏保持在右侧的位置（当减小窗口大小时）而不使用 JavaScript。有没有办法做到这一点，可能是通过使用一种占位符和 min/max-width 属性？

非常感谢。

Answer 1

在这个小提琴中使用绝对位置：

http://jsfiddle.net/K9K8b/2/

#iconmenu {
    padding-right: 3px;
    position: absolute;
    right: 0;
    height: 50px;
    background-color: grey;
}

它至少应该让你朝着正确的方向前进......