"Абсолютное" позиционирование и скрол в блоке

[С.]

Столкнулся со следуюший задачей и не могу найти более-менее изящного или даже просто нормального решения.

Есть некий блок, содержимое которого может скролится. Внутри этого блока разбросаны в определенном порядке элементы. Обычно разброска делалась бы position:absolute и все делов. Но содержимое блока может двигаться, а абсолютно позиционированные элементы не двигаются, даже если они DOMно размещены внутри этого блока. В принципе в этом есть своя логика.

По идее position:relative мог бы решить эту проблему. Но элементов внутри много и они имеют какие-то размеры. Соответственно при расчете позиции каждого следующего элемента над учитывать размеры предыдущего. Это на столько муторно, что не хотелось бы даже об этом думать. (Кстати логика, почему под relative-позиционированные элементы забивается его предполагаемое место в потоке, мне до сих пор не понятна.)

Как еще можно разместить элементе в произвольном порядке внутри блока, чтобы они скролились вместе с блоком? Желательно не iframe.

 

[флоппик]

Ничего не понятно, если честно.

 

[Semen]

Я тоже прочитал и не понял.
Если можно пример с картинками...

 

[WMix]

нужно верстать страничку (содержимое блока) без использования position
на обычных display, margin, padding, float, clear можно нарисовать практически что угодо...

 

[ksnk]

...Есть некий блок, содержимое которого может скролится. Внутри этого блока разбросаны в определенном порядке элементы. Обычно разброска делалась бы position:absolute и все делов. Но содержимое блока может двигаться, а абсолютно позиционированные элементы не двигаются, даже если они DOMно размещены внутри этого блока. В принципе в этом есть своя логика.

Тоесть какая-то разметка УЖЕ есть?

По идее position:relative мог бы решить эту проблему. Но элементов внутри много и они имеют какие-то размеры. Соответственно при расчете позиции каждого следующего элемента над учитывать размеры предыдущего. Это на столько муторно, что не хотелось бы даже об этом думать. (Кстати логика, почему под relative-позиционированные элементы забивается его предполагаемое место в потоке, мне до сих пор не понятна.)

Почему нельзя сделать скроллируемый элемент position:relative, а все его составляющие так и оставить position:absolute со смешением до угла элемента?

 

[С.]

 

[С.]

Почему нельзя сделать скроллируемый элемент position:relative, а все его составляющие так и оставить position:absolute со смешением до угла элемента?

Потому, что position:absolute элементы никогда не скролятся вместе с блоком, а только со всей страницей.

 

[ksnk]

Точно? http://jsfiddle.net/b4Nrd/1/

p.s.предыдущая ссылка была плохая

 

[WMix]

у тебя эти блоки внутри в ряд же... друг от друго маржином не хочешь отталкивать?

 

[С.]

Точно? http://jsfiddle.net/b4Nrd/1/

Ага! http://jsfiddle.net/w3gTk/

p.s.предыдущая ссылка была плохая

Да и эта так себе:

.absolute {
position absolute;
display:inine:block;
}

 

[С.]

у тебя эти блоки внутри в ряд же... друг от друго маржином не хочешь отталкивать?

Они динамически двигаются относительно друг друга.

 

[WMix]

картинка напоминает программу типа project..
если есть динамика, то есть яваскрипт обработчик, там и событие на изменение маржина...

 

[С.]

то есть яваскрипт обработчик, там и событие на изменение маржина...

Они и по вертикали двигаются. Замучаешься считать маржины.

 

[WMix]

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

 

[С.]

А ведь так и да! Если блоку добавить атрибут position:relative, то абсолютные элементы станут двигаться вместе с ним.

Интересно, это документированная фича? И где логика вообще?

 

[ksnk]

Да и эта так себе:

фидл почему-то сожрал правильный пример Сначала он был вот таким http://jsfiddle.net/b4Nrd/3/

Интересно, это документированная фича? И где логика вообще?

http://htmlbook.ru/css/position. Читать про absolute.
WMix на Javascript't можно скроллить все. вот только надо ли.

 

[WMix]

WMix на Javascript't можно скроллить все. вот только надо ли.

Они динамически двигаются относительно друг друга.

а вообщет прикольно

Так, если у родителя значение position установлено как static или родителя нет, то отсчет координат ведется от края окна браузера. Если у родителя значение position задано как fixed, relative или absolute, то отсчет координат ведется от края родительского элемента.

 

[С.]

на положение влияет значение свойства position родительского элемента. Так, если у родителя значение position установлено как static или родителя нет, то отсчет координат ведется от края окна браузера. Если у родителя значение position задано как fixed, relative или absolute, то отсчет координат ведется от края родительского элемента.

Кто бы мог подумать... Примем это за богоданное, поскольку логики в этом я все равно не вижу.

 

[fixxxer]

Все логично если ознакомиться с понятием containing block.
Если бы все блоки были containing, был бы полный бред с банальными вещами типа <b>

 

[С.]

The containing block is the last positioned element. so if you want to explicitly set the container then give it position:relative.

Не ясно, почему завязка на containing block идет по свойству позиционности, а не блочности. Как бы сам термин "containing block" даже намекает. Логичнее было бы раздел провести между inline и блочным элементами, а не позиционированными и поточными.