Новое
● Смена дизайна! Выражаем благодарность tørst vinden!

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

● Голосование "Сахарная Вата. Декабрь-январь.".

● Подведены итоги. "Новый Год с Зефиром".

● А также открыт новый конкурс, с мандаринками и елочными ветками. "Дед Мороз всея Зефира" желает побродить по форумам и оценить самую красивую рекламу и самый волшебный зимний дизайн. Спешите участвовать!

● Мы дополнили наш конкурс сладостей, и теперь "Сладкая Вата" продлена до января. Самое время рассказать каталогу свою новогоднюю сказку! Принимаются также работы и осенней тематики.

● ГОЛОСОВАНИЕ. ВЫБИРАЕМ ЛУЧШИЙ ДИЗАЙН И РЕКЛАМУ.

● Зефир в поисках писателей! Ждем с нетерпением в наборе персонала.

● Уже совсем скоро! "Сладкая Вата. Ноябрь"

Зефир

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Зефир » Архив выполненной верстки » [таблица] Leaden skies


[таблица] Leaden skies

Сообщений 1 страница 4 из 4

1

1. Название ролевой, ссылка:
Leaden skies
*отсутствие ссылки согласовано с АМС*
2. Что требуется:
скрипт таблицы
Макет
3. Дополнительно:
- ссылки слева при наведении должны менять цвет
- если текст не будет влезать в таблицу, должны появляться прокрутка

Отредактировано Hayes (2014-09-01 21:08:03)

0

2

Hayes

Код:
<table id="tabula"><tr>

<td class="columna">
<div class="capita">Навигация</div>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<a class="ancora" href="">ссылка</a>
<div class="capita">ТОПЫ и КАТАЛОГИ</div>
<a href=""><img src="http://placehold.it/88x31"></a><a href=""><img src="http://placehold.it/88x31"></a><a href=""><img src="http://placehold.it/88x31"></a><a href=""><img src="http://placehold.it/88x31"></a>
</td>

<td class="columna">
<div class="capita">Новости Форума</div>
<div class="scriptum">
Текст.
</div>
</td>

<td class="columna">
<div class="capita">В Игре</div>
Текст.
</td>

</tr></table>

CSS:

Код:
#tabula {width: 888px; height: 335px; background: #dbd7d8; border: 3px solid #808080; border-radius: 3px; border-collapse: collapse;}
.columna {width: 37.5%; padding: 0px 9px 0px 9px; border: 2px solid #939192; vertical-align: top;}
.columna:nth-child(1) {width: 25%; text-align: center;}
.capita {font-size: 20px; padding: 9px 0px; text-align: center;}
.ancora {display:block; text-align:center; text-decoration: none; background: #600604; color: white; margin: 3px 0px;}
.ancora:hover {background: #8c2421;}
.columna:nth-child(1) a:not(.ancora) {display: inline-block; padding: 3px;}
.scriptum {overflow-y: scroll; height: calc(100% - 50px);}

+1

3

Spiritus Tergi, спасибо Вам огромное. Но у меня почему-то некорректно отображается столбец ссылок. 
Вот ссылка на тестовик, где я хотела поэкспериментировать со стилем

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.


Добавлено спустя 26 минут 55 секунд:
все, я протупила, нашла собственную ошибку.
Спасибо!

Отредактировано Hayes (2014-09-02 16:42:10)

0

4

http://zephyr.f-rpg.ru/files/0013/e6/99/52870.png

0


Вы здесь » Зефир » Архив выполненной верстки » [таблица] Leaden skies


Рейтинг форумов | Создать форум бесплатно © 2007–2017 «QuadroSystems» LLC