Форма с фотографиями и свойство прокрутки

[call007]

Всем привет!!!

На сайте http://www.hrej.cz/clanky/preview/mafia-ii-prvni-dojmy/ в верхней части страницы есть небольшая форма в которой содержатся картинки. Как можно сделать точь в точь такую же? никто не знает?!

[SelenIT]

Знает сам указанный сайт (http://img.hrej.cz/css/layout.css?version=16, строка 2350):

.screenshots div div.list {
height:120px;
overflow:auto; /* это дает скроллинг, если он нужен */
padding:0;
white-space:nowrap;  /* это запрещает перенос строки */
width:100%;
}

Учитесь пользоваться функцией Inspect element в Firebug-е и ему подобных инструментах!

Edited April 21, 2009 by SelenIT

[call007]

Знает сам указанный сайт (http://img.hrej.cz/css/layout.css?version=16, строка 2350):

.screenshots div div.list {
height:120px;
overflow:auto; /* это дает скроллинг, если он нужен */
padding:0;
white-space:nowrap;  /* это запрещает перенос строки */
width:100%;
}

Учитесь пользоваться функцией Inspect element в Firebug-е и ему подобных инструментах!

О, спасибо, что разьснили что к чему!

А эти свойства применяются к созданной таблице? Если да, то как?

Edited April 21, 2009 by call007

[Searcher]

читаем про CSS

изучаем все свойства CSS

[call007]

Всем спасибо за помощь, разобрался!

Вот что вышло:

CSS код:

<style type="text/css">
.screenshots div div.list {
height:120px;
overflow:auto; /* это дает скроллинг, если он нужен */
scrollbar-base-color:red; /* цвет скроллинга */
scrollbar-track-color:black; /* цвет скроллинга */
crollbar-3dlight-color:black; /* цвет скроллинга */
scrollbar-darkshadow-color:#CCCCC; /* цвет скроллинга */
scrollbar-highlight-color:#CCCCC; /* цвет скроллинга */
scrollbar-shadow-color:#CCCCC; /* цвет скроллинга */
padding:0;
white-space:nowrap;  /* это запрещает перенос строки */
width:100%;
}
.holder {
	text-align: center;
	margin: 0 auto;
	width: 100%;
	position:absolute; /* Абсолютная позиция относительно элемента - то есть если эта форма с картинками находится в таблице и эту таблицу расширить - то вместе с ней увеличится и форма */
}
  </style>

html код:

<div class="holder" style="text-align:left; margin-top:0; margin-right:auto; margin-bottom:0; margin-left:auto; width:100%; position:absolute; z-index:1;"><div class="list">
	<p><a onclick="setDetailImage('detailimage','ob49edf8ddad77f',0);return false;" href=".?img=0#obr260986"><img id="obr260986" src="http://img.hrej.cz/1b/t_0aec1f2668e5110b010e1113834fee.jpg" width="160" height="90" alt="Obrazek ke clanku Mafia II - prvni dojmy " /></a> <a onclick="setDetailImage('detailimage','ob49edf8ddad77f',1);return false;" href=".?img=1#obr260987"><img id="obr260987" src="http://img.hrej.cz/e8/t_fe9d0cc7154533df28b8a3fe32d22a.jpg" width="145"
height="90" alt="Obrazek ke clanku Mafia II - prvni dojmy " /></a> <a onclick="setDetailImage('detailimage','ob49edf8ddad77f',2);return false;" href=".?img=2#obr260988"><img id="obr260988" src="http://img.hrej.cz/14/t_bac28706d1b902ccf33de4988303e9.jpg" width="145" height="90" alt="Obrazek ke clanku Mafia II - prvni dojmy " /></a> <a onclick="setDetailImage('detailimage','ob49edf8ddad77f',3);return false;" href=".?img=3#obr260989"><img id="obr260989" src="http://img.hrej.cz/5b/t_54ce93fd915bb1f51a082f4fd587f1.jpg"
width="145" height="90" alt="Obrazek ke clanku Mafia II - prvni dojmy " /></a> <a onclick="setDetailImage('detailimage','ob49edf8ddad77f',4);return false;" href=".?img=4#obr260990"><img id="obr260990" src="http://img.hrej.cz/ed/t_9d5a6934a589e416bbca3923555218.jpg" width="160" height="90" alt="Obrazek ke clanku Mafia II - prvni dojmy " /></a></p>
</div>
</div>
</div>

[Great Rash]

scrollbar-base-color:red; /* цвет скроллинга */

scrollbar-track-color:black; /* цвет скроллинга */

crollbar-3dlight-color:black; /* цвет скроллинга */

scrollbar-darkshadow-color:#CCCCC; /* цвет скроллинга */

scrollbar-highlight-color:#CCCCC; /* цвет скроллинга */

scrollbar-shadow-color:#CCCCC; /* цвет скроллинга */

Сразу видно юзера ИЕ

[call007]

Сразу видно юзера ИЕ

Ну почему же, я пользуюсь Opera и FF, вроде скролл отображается одинакого на всех браузерах

Возникла еще одна проблема:

необходимо сделать отцентровку этой формы (т.е. чтобы она была в центре строчки) и придать ей резиновость (чтобы при уменьшении сайта она сжималась, а при увеличении - расширялась).

Вставлял в стили width ="100%" - не помогает, при уменьшении страницы форма уходит за рамки сайта

Кто нибудь знает как это можно сделать подругому?