Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

позиционирование одинаковых блоков (задача на кроссбраузерность)

Обсуждение темы позиционирование одинаковых блоков (задача на кроссбраузерность) в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; шестой час страдаю... поставил вот себе задачку - бъюсь, но, пока - не пробился. задача такая: дано: - двухколоночный диз, ширина 895 пикс. ...


Закрытая тема
 
Опции темы
Старый 06.04.2007, 01:08   #1
шестой час страдаю...
поставил вот себе задачку - бъюсь, но, пока - не пробился.
задача такая:

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

нужно:
- чтоб в правой колонке выводимые последовательно блоки размещались в 2 колонки, строго друг под другом
- чтоб каждая картинка имела бордюр в 10 пикс и рамку вокруг него
- КРОССБРАУЗЕРНО

в принципе, сделать код для IE - просто, для оперы и фф - тоже просто, а вот для IE, оперы и фф - уже проблема.

пока вот куда меня занесло:

Код:
<link href="style.css" rel="stylesheet" type="text/css">
<div class="nc-cont">


<div class="nc-r-prev">
<table border="0" cellpadding="0" cellspacing="0">
<tr><td>

<div class="nc-img-th">
[img]001.jpg.jpg[/img]
</div>

<div class="nc-img-th">
[img]001.jpg.jpg[/img]
</div>
<div class="nc-img-th">
[img]001.jpg.jpg[/img]
</div>
<div class="nc-img-th">
[img]001.jpg.jpg[/img]
</div>
</td></tr>
</table>
</div>

<div class="nc-content">
<h1 class="nc-mainname">фотографии</h1>


Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. </p>
</div>

<div style="clear:both">подконтентные блоки</div>

</div>
и
Код:
/* CSS Document */
body {margin:0; padding:0; background-color:#4c4d4d; text-align:center}

p {text-align:justify; padding:0; margin: 5px 0 0 0}

.nc-cont {width:895px;margin:42px auto 20px auto; background-color:#FFFFFF; padding:0px; text-align:left}

.nc-content {float:none; margin:0 0 0 25px; padding:0;}

.nc-r-prev {float:right;width:610px; margin:50px 0 0 0; padding:0;}

.nc-img-th {float:left;padding:0 0 0 0px; margin:0 0 0 20px;border: #CCCCCC 1px solid; width:262px; text-align:center}

.nc-img-bord {border:#fff 10px solid;}
все, ушел биться головой апстену...
 
Старый 06.04.2007, 01:08
Ссылки
Старый 06.04.2007, 01:08
Закрытая тема




Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Эффекты блоков при загрузке страницы Листок HTML, CSS, JavaScript 2 03.04.2015 08:38
Непонятная вложенность блоков в Opera kpripper HTML, CSS, JavaScript 6 19.02.2012 00:07
Основная задача synyster Кальянная 6 09.05.2009 13:24
Почему такая разница в двух одинаковых файлах? Begemot Технологии Flash 2 10.02.2005 12:55
Задача за вознаграждение Spy HTML, CSS, JavaScript 1 19.08.2003 18:06


Текущее время: 15:13. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Дизайнерский форум