|
позиционирование одинаковых блоков (задача на кроссбраузерность)Обсуждение темы позиционирование одинаковых блоков (задача на кроссбраузерность) в разделе 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;} |
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Эффекты блоков при загрузке страницы | Листок | 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 |
Реклама на форуме
Условия размещения рекламы
Биржа ссылок
Заработай на сайте!
|