Идеальный PopUp на html+css?

Question

[Рюрик Ростиславич]

В поисках удобного и не загруженного PopUp окна на html+css.
Без Js

Спасибо

Answer 1

[Дмитрий]

С кнопкой "Закрыть": Пример
Если почистить анимацию, то будет нормально
А вообще, ответ выше без кнопки "Закрыть" вполне себе современный вариант дизайна модельного окна

Answer 2

[Глюкъ Виртуален]

Идеальный popup — это его отсутствие.

Comments

[Max Payne]

Как боженька смолвил.

Answer 3

[Сергей]

А в чём тогда проблема?

.layout {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.5);
}

.layout__inner {
	width: 400px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% -50%);
	background: #fff;
}

Comments

[GM2mars]

Как он открывается и закрывается?

[Nikolay Talanov]

Если есть возможность задать определенную высоту, то центровать лучше с помощью отрицательных марджинов, а не трансформа, ибо из-за него текст "смазывается".