|
|
Регистрация Восстановить пароль |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
13.04.2011, 16:13 | #1 |
Пользователь
Регистрация: 11.06.2009
Сообщений: 19
|
Относительное позиционирование
Люди, помогите, пожалуйста. Мне нужно, чтобы на любом мониторе блок с картинками отображался как на макете. Как это сделать можно?
Сделал для своего монитора абсолютное позиционирование, но так же нельзя(((. Должно быть вот так на любом мониторе: Мой код: Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>melkortheshadow.com</title> <style> body{ margin:20px; padding:0; font-family:tahoma; font-size:11px; background-color:#fcfcfd; } p{ color:#393939; } #menu{ position:absolute; top:9px; left:440px; } #menu a{ color:#393939; margin-right:14px; } #menu a:hover{ color:#c1c1c1; } #container{ position:absolute; top:387; left:218; z-index:0; height:150px; } #container div{ display:inline; } #container div a img{ border:none; } #first{ margin-right:10px; padding:0; } #second{ margin-left:10px; padding:0; } </style> </head> <body> <!-- <table style="position:absolute; left:0; top:0;" width="100%" height="100%" border="1px" cellpadding="0" cellspacing="20"> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table> --> <div id="container"> <div id="first"> <a href="#"><img width="200" height="150" /></a> </div> <div id="second"> <a href="#"><img width="200" height="150" /></a> </div> </div> <div id="menu"> <a href="#">about me</a> <a href="#">works</a> <a href="#">contacts</a> <a href="#">blog</a> </div> </body> </html>
Каждый должен совершать свои собственные ошибки (с) Агата Кристи
Последний раз редактировалось melkortheshadow; 13.04.2011 в 16:31. |
13.04.2011, 17:06 | #2 | |
Регистрация: 08.04.2011
Сообщений: 8
|
Цитата:
Только тогда родительскому блоку еще нужно задать фиксированные размеры вроде. P.S.Сам новичок, могу ошибаться |
|
13.04.2011, 20:26 | #3 |
Пользователь
Регистрация: 11.06.2009
Сообщений: 19
|
А как это сделать? Можно какой-нибудь пример кода?
Каждый должен совершать свои собственные ошибки (с) Агата Кристи
|
13.04.2011, 21:24 | #4 |
Регистрация: 08.04.2011
Сообщений: 8
|
В общем, если я правильно понял, в чем проблема:
Код HTML: Код HTML:
<body> <div id="main"> <!--Главный блок--> <div id="d1"> <!--Первый внутренний--> </div> <div id="d2"> <!--Второй внутренний--Ю </div> </div> Код:
|
13.04.2011, 22:49 | #5 |
Пользователь
Регистрация: 11.06.2009
Сообщений: 19
|
Спасибо, заработало, но не решена главная проблема - как поместить блок #main на низ второй трети страницы по-вертикали и поставить его на четкую середину первой и второй третей по-горизонтали.
Каждый должен совершать свои собственные ошибки (с) Агата Кристи
|
13.04.2011, 23:02 | #6 |
Регистрация: 08.04.2011
Сообщений: 8
|
Правила top и left .
Нет? Если указать для елементов html и body ширину и высоту по 100%, то можно будет и для #main указывать расположение в процентах относительно родительского блока (в данном случае <body>) |
13.04.2011, 23:10 | #7 |
Пользователь
Регистрация: 11.06.2009
Сообщений: 19
|
Тут не совсем все просто. Прошу обратить внимание на сетку макета (верхний). Он так не ляжет. Либо, не встанет на двихло(((. Надо что-то более действенное в данном случае. А что, если попробовать их не в одном блоке, а как 2 разных пихать? Проще не станет?
Каждый должен совершать свои собственные ошибки (с) Агата Кристи
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Проблема с рамами/Проблема с ЖД | DRAGGER | Компьютерное железо | 6 | 04.01.2009 23:37 |