@3dben

Как с помощью псевдокласса добавить блок?

Здравствуйте. В этом коде https://jsfiddle.net/mmnoyjoL/1/ у меня не получается добавить блок с помощью псевдокласса ::after. Оранжевый блок должен быть поверх синего. поэтому я использовал z-index, а также у меня не выходит выровнять оранжевый блок по середине серого(основного контейнера). margin: auto; в данном случае не работает.

Подскажите каким образом можно реализовать это. Спасибо.
  • Вопрос задан
  • 229 просмотров
Решения вопроса 1
27cm
@27cm
TODO: Написать статус
.main
{
	height: 300px;
	width: 100%;
	background-color: #c6c6c6;
}

.top, .top::after
{
  display: block;
  width: 200px;
  height: 200px;
}

.top 
{
  margin: 0 auto;
  position: relative;
  background-color: #6a56ff;
  top: 50px;
  left: 50px;
}

.top::after 
{
  content: '';
  position: absolute;
  background-color: #ffcb56;
  top: -50px;
  left: -50px;
}

https://jsfiddle.net/otnn807y/1/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
SPIKS Санкт-Петербург
от 70 000 до 90 000 ₽
PERX Нижний Новгород
До 50 000 ₽
move2usajobs.com LLC Лос-Анджелес
от 2 000 до 4 000 $