Сыпятся эелементы.

[climber2002]

Задача:

Сделать полку по всей ширине страницы, на ней находятся книги, статуэтки и т.д.Предметы должны свободно перемещаться по полке и не закрывать друг-друга.Решил с помощью плагина jquery-ui Sortable(Так же они должны подсвечиваться при наведении, выпадать из каждого элемента подсказка, при давлклике выпадать меню <— это так, к слову).Всё сделал проКроссил ,но вот беда как начинаю сужать браузер предметы с полки начинают сыпаться.Никак не могу решить проблему чтоб всё оставалось на оси х.Пробовал интересный плагин imagefit,всё здорово но при уменьшении предметы не падают а начинают съезжать с полки т.е. их не получается уменьшать картинку по оси х и у и чтобы они остались на полке.Дабы вас не путать выклдываю пример.

Где:

Синие и оранжевые рамки - это большие предметы(перемещаемые).

Зеленые рамки - полка(по которой перемещают).

Серые рамки - место куда падает перемещаемый элемент.

Фулл скрин - Моя ссылка

С кодом - http://jsfiddle.net/fYXqM/3/

Помогите разобраться.Заранее благодарен.С уважением ,Егор.

[RK-007]

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

P/S Заранее никогда не благодари - проявляешь неуважение!

Edited July 6, 2012 by RK-007

[USF]

а мне интересно, зачем и float:left и display: inline-block ?

[climber2002]

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

P/S Заранее никогда не благодари - проявляешь неуважение!

Да вроде выставил.Могу на почту кинуть чтобы полностью картина ясна была?

а мне интересно, зачем и float:left и display: inline-block ?

А почему так делать нельзя?

[USF]

А почему так делать нельзя?

ни то чтобы нельзя. просто в вашем случае они выполняют идентичную роль - располагают элементы в 1 ряд.

[climber2002]

А почему так делать нельзя?

ни то чтобы нельзя. просто в вашем случае они выполняют идентичную роль - располагают элементы в 1 ряд.

Ну, да.Код надо будет чистить, я просто уже не знал что делать, начал пробовать всё.Вот такие кракозябры и появились.

Там с вашей стороны понятно я изложил вопрос/проблему?

Edited July 8, 2012 by climber2002

[USF]

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

[climber2002]

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

тут другая проблема, я нашёл плагин который маштабирует img: http://jsfiddle.net/fYXqM/3/embedded/result/

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

Поэтому решил вернуться в исходнику.

P.S. надо только плагин Imagefit поставить.

Edited July 8, 2012 by climber2002

[climber2002]

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

P/S Заранее никогда не благодари - проявляешь неуважение!

Пробовал, могу всё на почту скинуть, будет всё и сразу.

У меня как у начинающего верстальщика складывается впечатление, что я изначально не потому пути пошёл.

Edited July 8, 2012 by climber2002