X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Скроллинг в IE
Дмитрий123
Дмитрий123
Topic Starter сообщение 27.12.2010, 22:26; Ответить: Дмитрий123
Сообщение #1


<html>
<head>
<style>
#list {
overflow-x: scroll;
white-space: nowrap;
clear: both;
}
#list div {
display: inline-block;
float: none;
position: relative;
border: 1px solid #7C7C7C;
word-wrap: break-word;
padding: 0 5px;
}
</style>
</head>
<body>
<div id="list">
<div><img src="http://html.by/images/html.png" alt="HTML.by" /></div>
<div><img src="http://html.by/images/html.png" alt="HTML.by" /></div>
</div>
</body>
</html>

Вот страница, во всех современных браузерах отображается нормально, но в IE7 и ниже, изображения переносятся друг под друга, как это исправить?
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
сообщение 27.12.2010, 22:43; Ответить: vasvas7775
Сообщение #2


можно попробовать вместо блоков таблицу прописать
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Дмитрий123
Дмитрий123
Topic Starter сообщение 27.12.2010, 22:45; Ответить: Дмитрий123
Сообщение #3


vasvas7775, таблицой не вариант
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
сообщение 27.12.2010, 22:50; Ответить: vasvas7775
Сообщение #4


Тогда попробуй двум дивам, которые находятся в list, задать стиль, точные размеры, и расположение, притом размеры укажи еще и в img
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Дмитрий123
Дмитрий123
Topic Starter сообщение 27.12.2010, 22:55; Ответить: Дмитрий123
Сообщение #5


vasvas7775, не помогает.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
сообщение 27.12.2010, 23:00; Ответить: vasvas7775
Сообщение #6


объясни мне, картинки должны быть на одной строке, или картинка под картинкой.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Дмитрий123
Дмитрий123
Topic Starter сообщение 27.12.2010, 23:04; Ответить: Дмитрий123
Сообщение #7


vasvas7775, картинки должны быть на одной строке, если картинок будет много, то они должны скролиться
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
сообщение 27.12.2010, 23:12; Ответить: vasvas7775
Сообщение #8


Вот посмотри этот принцип, вместо картинки я поставил цвет сам изменишь, у меня в трех браузерах работает:
[CSS]<html>
<head>
<title></title>
<style>
#list { overflow-x: scroll; white-space: nowrap; clear: both; }
#list div {display: inline-block; position: relative; border: 1px solid #7C7C7C;
word-wrap: break-word; padding: 0 5px;}
#r1 { width:150px; height:70px; float:left; background-color:#CC0000;}
#r2 { width:150px; height:70px; float:left; background-color:#000099;}
</style>
</head>
<body>

<div id="list">
<div id="r1"></div>
<div id="r2"></div>
</div>

</body>
</html>[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Дмитрий123
Дмитрий123
Topic Starter сообщение 27.12.2010, 23:17; Ответить: Дмитрий123
Сообщение #9


vasvas7775, сделай таких блоков 20 шт, и увидишь, что полоса прокрутки не работает
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FightInGlory
FightInGlory
сообщение 27.12.2010, 23:51; Ответить: FightInGlory
Сообщение #10


[CSS]
#list div {
display: inline-block;
//display:inline;
//zoom:1;
float: none;
position: relative;
border: 1px solid #7C7C7C;
word-wrap: break-word;
padding: 0 5px;
}
[/CSS]
IE7 и ниже не знают такого свойстка как display:inline-block;
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
« Предыдущая тема · Программная часть · Следующая тема »
 
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


 

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

RSS Текстовая версия Сейчас: 24.4.2024, 16:21

Дизайн

 
Форум IP.Board © 2024  IPS, Inc.
Лицензия зарегистрирована на: MaulNet
Jooble
Форум IP.Board © IPS, Inc.
Лицензия зарегистрирована на: MaulNet