Поместить кнопку внутрь блока

[Неугомонный]

Как всегда я % 80 смог сделать а дальше не тащу вообще. В общем как сделать чтобы "Кнопка" была внутри фиолетового контейнера  но не помещая ее в <div class=main></div> ?

https://jsfiddle.net/4Lepbdnr/

Edited July 27, 2019 by Неугомонный

[AlexZaw]

14 минут назад, Неугомонный сказал:

но не помещая ее в <div class=main></div>

<div class="wrap">
  <a class="" href="#">Кнопка</a>
  <div class=main></div>
</div>

a {
  color: #321312;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.wrap {
  position: relative;
  height: 100%;
}

.main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2D3142;
  transition: transform .7s ease-in-out;
}

 

[Неугомонный]

36 минут назад, AlexZaw сказал:

<div class="wrap">
  <a class="" href="#">Кнопка</a>
  <div class=main></div>
</div>

a {
  color: #321312;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.wrap {
  position: relative;
  height: 100%;
}

.main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2D3142;
  transition: transform .7s ease-in-out;
}

 

Как я понимаю widht и height 100% можно заменить на right:0; и bottom:0; , получу тот же эффект в совокупности с top: 0; и left:0?

[AlexZaw]

1 минуту назад, Неугомонный сказал:

Как я понимаю widht и height 100% можно заменить на right:0; и bottom:0;

Можно, просто мне с width и height  привычнее :)

[Неугомонный]

Поковырялся не та реализация кода..., спасибо за помощь пойду дальше искать от куда черпать базу

Edited July 27, 2019 by Неугомонный

[AlexZaw]

8 часов назад, Неугомонный сказал:

Поковырялся не та реализация кода.

В смысле не та реализация? :)