задумка такая. я хочу поделить страницу на 4 части. 4 прямоугольника. каждый прямоугольник ведёт на свою половину сайта. собственно наглядно вот код:

Код

<html> <head><title>######## — ########</title> <meta http-equiv='content-type' content='text/css; charset=windows-1251'> <link rel='stylesheet' href='index.css'> </head> <body topmargin='0' bottommargin='0' leftmargin='0' rightmargin='0'> <table width='100%' height='100%' cellspacing='0' cellpadding='0' border='0'> <tr> <td width='50%' height='100%'> <table width='100%' height='100%' cellspacing='0' cellpadding='0' border='0'> <tr> <td width='100%' height='50%' class='simply'> <div align='center'><img src='simply/title.gif' width='188' height='56' border='0'></div> </td> </tr> <tr> <td width='100%' height='50%' class='light'> <div align='center'><img src='light/title.gif' width='211' height='41' border='0'></div> </td> </tr> </table> </td> <td width='50%'> <table width='100%' height='100%' cellspacing='0' cellpadding='0' border='0'> <tr> <td width='100%' height='50%' class='grunge'> <div align='center'><img src='grunge/title.gif' width='273' height='77' border='0'></div> </td> </tr> <tr> <td width='100%' height='50%' class='gothic'> <div align='center'><img src='gothic/title.gif' width='231' height='47' border='0'></div> </td> </tr> </table> </td> </tr> </table> </body> </html>

чтобы грамотно реализовать мою задумку, мне нужны следующие знания:

1. Как в моём случае разместить картинку на отдельнем слое внизу справа\слева, минуя все границы таблиц.

2. Как разместить картинку в границах отдной области (в моем случае - квадрата) на слое. Допустим возмем нижний правый квадрат. Как разместить на отдельном слое картинку впритык к верхней границе слева\справа.

собственно узнав эти две вещи. я думаю я смогу разобраться дальше сам. заранее благодарен.

Юзай абсолютное позиционирование.

Код

<div style='position: absolute'><img src='simply/title.gif' width='188' height='56' border='0'></div> <div style='position: absolute; right: 0'><img src='simply/title.gif' width='188' height='56' border='0'></div> <div style='position: absolute; left: 40%; top: 45%'><img src='simply/title.gif' width='188' height='56' border='0'></div> <div style='position: absolute; bottom: 0'><img src='simply/title.gif' width='188' height='56' border='0'></div> <div style='position: absolute; bottom: 0; right: 0'><img src='simply/title.gif' width='188' height='56' border='0'></div>

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

Присоединённый файл ( Кол-во скачиваний: 7 )
 Untitled_2.gif 1,33 Kb

Добавляешь в таблицу стилей:

Код

td {position: relative}

и в DIV-ах устанавливаешь не абсолютную а относительную позицию: position: relative