Два полностью независимых слоя. Один над другим.

Dasha · July 10, 2012

Доброй всем ночки. Сразу прошу прощения за вопрос. Но до ответа на него я что-то не могу никак дойти.

Проблема вот в чем.

Есть два слоя. Нужно сделать так, чтобы один был над другим. При этом нужно сделать так, чтобы один слой был ровно над другим, куда бы мы этот див в body документа не вставили. То есть их содержимое друг с другом не должно быть связано никак. Чтобы, к примеру, какой-то скрипт, вставленный в один слой, не трогал вообще никак другой, не смещал его никуда.

Вариант с тем, чтобы у одного слоя поставить

left: 200px;

top: 20px;

а у другого

left: 200px;

top: -40px;

к примеру не подходит. Визуально один слой на другой наложится,

но такие дивы в body не переставить местами уже. Динамическое содержание верхнего слоя в этом случае также будет двигать нижний слой. Подскажите, что я не так сделала, мой код ниже. Не судите строго, я только учусь.

<style>

div#base {   
    position: absolute; 
    margin-left: 49%; 

    z-index: 5;
   }

div#layer1 {
    font-size: 50px; 
    color: #000080; 
    position: relative;

    left: 200px; 
    top: 20px;

    z-index: 2; 
}


div#layer2 {

    color: #ffa500; /* orange */
    font-size:70px; 
    position: relative;

    left: 200px; 
    top: 20px;

z-index: 1; 
}
</style>

</head>
<body>


  <div id="layer1">Слой 1</div>
  <div id="layer2">Слой 2</div> 


</body>
</html>

Yazon_Nile · July 11, 2012

Как-то смутно представляю, что нужно)

Modestes · July 11, 2012

Мне тоже не совсем понятно.

Покажите пример того что должно получится в итоге.

Sign In

Два полностью независимых слоя. Один над другим.

Question

Dasha

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

Yazon_Nile

Link to comment

Share on other sites

Modestes

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information