Форум hotibo.ru

Сайты - по стандартам, но не стандартные сайты!






Страниц: 1

 

#1 13.12.2009 16:48

casey
Новичок
Зарегистрирован: 13.12.2009
Сообщений: 11

Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

Здравствуйте!

Возникла такая проблема:
Делаю "листалку" картинок во внешнем фрейме. Надо сделать так, чтобы в этом фрейме блок каждой картинки был шириной 25%, т.е. показывается при любой растяжке 4 картинки.

Проблема вот в чём: если картинок больше 4х, как сделать чтобы блоки каритнок не переносились на новую строку, т.е. чтобы была прокрутка?

Блок картинки - в общем случае что-то типа

Код:

Пробовал поместить div.i в контейнер с white-space:nowrap; и сделать div.i {float:left} - безрезультатно.

Единственный рабочий вариант (но только в IE) - без контейнера, но

Код:

div.i {
    width:25%;
    text-align:center;
    display:inline;
}

Может кто-нибудь знает, как это сделать?

Нет на форуме

 

#2 13.12.2009 17:15

MT
Опытный
Откуда: Moscow
Зарегистрирован: 23.11.2009
Сообщений: 241
Вебсайт

Re: Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

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

P. S. И div из блока картинки убрать ;-)

Отредактированно MT (13.12.2009 17:16)

блог | музыка | браузер

Нет на форуме

 

#3 13.12.2009 17:31

casey
Новичок
Зарегистрирован: 13.12.2009
Сообщений: 11

Re: Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

Позиционировать абсолютно - да, вариант, но не очень удачный - потом будет очень сложно делать саму "листалку" - получится усложнённый JS... Но как вариант - вполне.

Div'ы убрать увы нельзя - ибо в блоке картинки будет еще и текст, ссылка, да и центрирование по горизонтали нужно...

Нет на форуме

 

#4 14.12.2009 06:15

Kildor
Новичок
Зарегистрирован: 27.11.2009
Сообщений: 9

Re: Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

display:inline-block? — правда фф не понимает это свойство :-(
или display:table; display:table-cell — не понимает ИЕ.

Нет на форуме

 

#5 14.12.2009 08:42

Chipmunk
Новичок
Зарегистрирован: 29.11.2009
Сообщений: 8

Re: Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

2casey: а вот такой код не прокатит разве:



...



left если ты используешь какой либо язык не составит труда посчитать. Если не используешь php или perl - можно тут попользовать жабаскрипт - благо он примитивен будет.

Единственный недостаток - грязь в коде, хотя вроде strict не запрещает писать style -))

Нет на форуме

 

#6 15.12.2009 13:23

casey
Новичок
Зарегистрирован: 13.12.2009
Сообщений: 11

Re: Как сделать, чтобы div'ы не переносились на след. строчку (скроллинг)

2Chipmunk - да, абсолютное позиционирование решило проблему.

Громоздкости кода не наблюдал - сделал "листалку" путём размещения линейки с фотками 2 раза во фрейме (т.е. каждая фотка присутствует в 2х экземплярах) при мгновенном скролле на их стыке - получился полный эффект замкнутого круга.

Всем спасибо!

Нет на форуме

 

 

Страниц: 1


Board footer