Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> Как сверстать?
VladKamyshanov  
 ۩     Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Старик
***

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 100
Пользователь №: 33005
На форуме: 4 года, 4 месяца, 22 дня
Карма: 3




Привет всем! biggrin.gif

Хочу сверстать такую штуку, чтоб блоки уходили за правый край экрана) Количество блоков может быть разное и должна присутствовать прокрутка.
Прикладываю эскиз)(примерно, рисовал от руки smile.gif )

Спасибо за помощь)

Присоединённое изображение
Присоединённое изображение
PM
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
inpost  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Помагите Здесь живу!!!
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 22693
Пользователь №: 20039
На форуме: 7 лет
Карма: 599




div с стилями: width, overflow.
Так делается родитель. Внутри каждый див-child делается с float:left, таким образом он будет тянуться в ширину дальше-дальше...


--------------------
Обучаю веб-программированию качественно и не дорого: http://school-php.com
Фрилансер, принимаю заказы: PHP, JS, AS (видео-чаты). Писать в ЛС (Личные сообщения на phpforum).
PMПисьмо на e-mail пользователюICQ
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
VladKamyshanov  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Старик
***

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 100
Пользователь №: 33005
На форуме: 4 года, 4 месяца, 22 дня
Карма: 3




Ок. Спасибо. Буду пробовать
PM
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
redreem  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 4258
Пользователь №: 29002
На форуме: 5 лет, 4 месяца, 7 дней
Карма: 147




inpost

непроверял в такой конфигурации, но сдается мне что флоаты не будут двигать див в ширину.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
SoMeOnE  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1495
Пользователь №: 24575
На форуме: 6 лет, 1 месяц, 10 дней
Карма: 38




элемент float перейдет на новую строку если не хватит ширины родительского, если не ошибаюсь.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
netruxa  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 472
Пользователь №: 4715
На форуме: 8 лет, 8 месяцев, 5 дней
Карма: 19




да, float не прокатит
первое, что пришло в голову - сделать табличкой. уж она растягивает экран нормально


--------------------
ввв.парсер.рф - онлайн система проверки позиций Вашего сайта в поисковиках. Для форумчан 100 рублей на счет.
PMСайт пользователя
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Hello  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 837
Пользователь №: 32378
На форуме: 4 года, 6 месяцев, 27 дней
Карма: 50




SoMeOnE
Для того чтобы не переходил на новую строку и нужен overflow


--------------------
VPS от 5$, первые 2 месяца - бесплатно.
PM
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
inpost  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Помагите Здесь живу!!!
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 22693
Пользователь №: 20039
На форуме: 7 лет
Карма: 599




Я же написал про overflow для родителя. Почему вдруг float:left перейдет на новую строчку?


--------------------
Обучаю веб-программированию качественно и не дорого: http://school-php.com
Фрилансер, принимаю заказы: PHP, JS, AS (видео-чаты). Писать в ЛС (Личные сообщения на phpforum).
PMПисьмо на e-mail пользователюICQ
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
VladKamyshanov  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Старик
***

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 100
Пользователь №: 33005
На форуме: 4 года, 4 месяца, 22 дня
Карма: 3




inpost
не работает. сделал так:

Родитель:
.file-list{
overflow: auto;
position: absolute;
height: 300px;
top: 50%;
margin-top: -25%;
left: 3%;
}


Див - child
.file-list .item{
float: left;
width: 280px;
height: 300px;
background-color: #999;
margin-right: 3px;
}


Блоки переносятся(

PS

Хотел спросить как можно сделать порядок блоков такой(если не сложно)

[1][3][5]
[2][4][6]
PM
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
inpost  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Помагите Здесь живу!!!
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 22693
Пользователь №: 20039
На форуме: 7 лет
Карма: 599




VladKamyshanov
Ты просишь: "скролл дайте мне", а сам прописываешь overflow: auto; Почему ты думаешь, что автоматически он выберет скролл, а не фикс?


--------------------
Обучаю веб-программированию качественно и не дорого: http://school-php.com
Фрилансер, принимаю заказы: PHP, JS, AS (видео-чаты). Писать в ЛС (Личные сообщения на phpforum).
PMПисьмо на e-mail пользователюICQ
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса