Помощник
 |
|
|
|
|
Сообщение сайта
|
 position:absolute перекрывает другие объекты |
alexdrob
|
Сообщение
#1
|
||
|
0  
 Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация:  0 
 |
|
||
 |
|
||
|
mik393
|
 19.11.2009, 16:44;
Ответить: mik393
Сообщение
#2
|
|
0 Группа: User Сообщений: 9 Регистрация: 26.10.2009 Поблагодарили: 0 раз Репутация: 0
|
А если попробовать position:absolute для квадрата?
|
|
|
|
|
alexdrob
|
Сообщение
#3
|
|
0
Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0
|
так будет работать но проблемма в том что я тогда при растягивании квадрата не смогу снизу прилепить блок.
это просто набросок |
|
|
|
|
alexdrob
|
Сообщение
#4
|
|
0
Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0
|
сайт поделён на две части, в зависимости от того какая длиньше становится низ сайта. Под обе части надо провести линию чтоб не перекрывала.
если обе части position absolute то всё работает с z-index но тогда самый низ не удаётся поставить именно ниже всего содержимого. можно конечно всё взять засунуть ещё в контейнер но хотелось узнать если ли какой способ поместить объект как спрашивается в посте номер 1. |
|
|
|
|
mik393
|
19.11.2009, 16:55;
Ответить: mik393
Сообщение
#5
|
|
0 Группа: User Сообщений: 9 Регистрация: 26.10.2009 Поблагодарили: 0 раз Репутация: 0
|
Что-то сегодня туго догоняю))) Кинь картинку чтоли как тебе надо расположить, или код, может смогу помочь, но не обещаю)
|
|
|
|
|
alexdrob
|
Сообщение
#6
|
|
0
Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0
|
<!DOCTYPE html> <html> <head> <title>Untitled</title> </head> <style> body{width:600px;margin: 0 auto;position:relative;} #line{font-size:0;background-color:#000000;width:700px;position:absolute;left:-50px;top:10px;height:3px} #left_column{float:left;width:300px;background-color:#ffffcc} #right_column{margin-left:300px;background-color:#3399ff} #bottom{clear:both;text-align:center} </style> <body> <div id="line"></div> <div id="left_column">ëåâàÿ êîëîíêà<br/>íîâàÿ ñòðîêà</div> <div id="right_column">ïðàâàÿ êîëîíêà</div> <div id="bottom">íèç</div> </body> </html> вот так можно но с дополнительным дивом эт я разобрался. а без него <!DOCTYPE html>
<html> <head> <title>Untitled</title> </head> <style> body{width:600px;margin: 0 auto;position:relative;} #cont{position:relative;} #line{font-size:0;background-color:#000000;width:700px;position:absolute;left:-50px;top:10px;height:3px} #left_column{float:left;width:300px;background-color:#ffffcc} #right_column{margin-left:300px;background-color:#3399ff} #bottom{clear:both;text-align:center} </style> <body> <div id="line"></div> <div id="cont"> <div id="left_column">ëåâàÿ êîëîíêà<br/>íîâàÿ ñòðîêà</div> <div id="right_column">ïðàâàÿ êîëîíêà</div> </div> <div id="bottom">íèç</div> </body> </html> |
|
|
|
|
mik393
|
19.11.2009, 17:32;
Ответить: mik393
Сообщение
#7
|
|
0 Группа: User Сообщений: 9 Регистрация: 26.10.2009 Поблагодарили: 0 раз Репутация: 0
|
Если я правильно понял, то вроде так должно работать с z-index:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <style> body{width:600px;margin: 0 auto;position:relative; z-index: 2;} #line{font-size:0;background-color:#000000;width:700px;position:relative; z-index: 1; left:-50px;top:10px;height:3px} #left_column{float:left;width:300px;background-color:#ffffcc; position:relative; z-index:2;} #right_column{margin-left:300px;background-color:#3399ff; position:relative; z-index:2;} #bottom{clear:both;text-align:center; background:#333333} </style> <body> <div id="line"></div> <div id="left_column">ëåâàÿ êîëîíêà<br/>íîâàÿ ñòðîêà</div> <div id="right_column">ïðàâàÿ êîëîíêà</div> <div id="bottom">íèç</div> </body> </html> Я просто с z-index мало работал, но тут суть в том, что все к кому применяешь z-index должны иметь позиционирование, тогда должно быть гуд |
|
|
|
|
alexdrob
|
Сообщение
#8
|
|
0
Группа: User Сообщений: 6488 Регистрация: 8.9.2009 Поблагодарили: 0 раз Репутация: 0
|
работает, спасибо)
|
|
|
|
|
AndreySmith
|
19.11.2009, 19:41;
Ответить: AndreySmith
Сообщение
#9
|
|
 0 Группа: User Сообщений: 544 Регистрация: 31.7.2009 Поблагодарили: 0 раз Репутация: 0
|
<div style="position:absolute; top:99px; background-color:black; height:11px; width:1000px; left: 8px;">
<div style="background-color:red; width:200px;height:200px; position:relative; top:-30px; left:30px;" ></div> </div> Красный квадрат на черном отрезке.
|
|
|
|
|
|
|
|
Похожие темы
| Тема | Ответов | Автор | Просмотров | Последний ответ | |
|---|---|---|---|---|---|
 |
ПОДБИРАЮ ПОСТЫ ДЛЯ ГРУПП ВК (РЕДАКТОР ВК) И ДРУГИЕ УСЛУГИ | 0 | robot_yaga2 | 780 | 30.5.2023, 15:52 автор: robot_yaga2 |
 |
 Написание скриптов на PHP, в т.ч. модулей для CMS, и другие услугиСоздание модулей и хаков для DLE и других движков, перенос контента |
170 | Coppermine | 118346 | 24.2.2023, 12:30 автор: boltuk |
|
CASHWALLET - сервис обмена криптовалют, BTC на Рубль и другие направления |
25 | cashwallet | 13722 | 29.12.2022, 13:23 автор: cashwallet |
|
Аудит сайта от 1900 руб, технический, юзабилити, анализ конкурентов, другие seo услуги | 0 | про100та | 1154 | 22.7.2022, 23:26 автор: про100та |
|
Тексты на спортивную тематику и другие услуги | 23 | Mak_Pet | 10536 | 6.4.2021, 19:59 автор: Mak_Pet |
|
Текстовая версия | Сейчас: 26.4.2024, 8:52 |
