сделать элементы позы прилипшими друг к другу

Question

Я хочу, чтобы при изменении размера окна элементы позиции перемещались друг под другом, у меня есть заголовок, высота которого увеличивается с уменьшением размера окна.при нажатии на элемент в меню отображается подменю, меню появится в главном меню, и оно должно придерживаться нижней части заголовка при изменении размера окна.

Я пытаюсь решить проблему, обнаружив экранразмер по js и динамическое изменение вершины, но оно внезапно при изменении размера окна, вершина отличается от того, что должно быть, и становится в центре окна ...

Я делаю простой пример здесь http://jsfiddle.net/xv8hS/1/

автоматическая высота не работает в этой версии!Я хочу, чтобы зеленая полоса стала под панелью элементов при изменении размера окна все больше и больше.

Answer 1

Это не позиционирование, а плавающая проблема. Используйте пустой <div> с clear:both в заголовке ( демонстрация ):

<div id="container">   
    <div id="header">
        <ul>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div id="submenu"></div>
</div>

#container{
    position:relative;
    min-height:300px;
    height:auto;

    width:100%;
}

#header{

    width:100%;
    min-height:80px;
    height:auto;
    background-color:red;
    posistion:absolute;
    top:0;
    right:0;

}
#header ul{

    width:100%;
    min-height:20px;
    height:auto;
}
#header ul li{
    min-height:50px;
    height:auto;
    display:inline-block;
    float:left;
    width:200px;
}
#submenu{
    width:70%;
    min-height:20px;
    height:auto;
    height:5%;
    background-color:green;
    posistion:absolute;
    top:10%;
    right:0;

}
.clearfix{clear:both;}

Смотри также:

• CSS 2,1: 9,5 Поплавки
• Все о поплавках