@storm-coder

Почему текст в заголовке второго уровня не выводится на экран?

Почему не работает заголовок второго уровня с классом time (<h2> или например, параграф <p>).<h1 class="time"> который находится в блоке<div class="head clearfix">? С<h1> все ок. Там параллакс... возможно поэтому.

<div class="head clearfix"> <!--контент, с фиксированной шириной, центрирован-->
            <div class="head-logo">
                <a href="#"><img src="img/logo.png" alt="logo"></a>
            </div>
            <div class="menu-wrapper">
                <nav class="main-menu">
                    <ul class="menu">
                        <li><a href="#">home</a></li>
                        <li><a href="#">services</a></li>
                        <li><a href="#">portfolio</a></li>
                        <li><a href="#">about</a></li>
                        <li><a href="#">contact</a></li>
                    </ul>
                </nav>
            </div>
            <p class="wel">Let's work together!</p>
            <h1>It’s nice to meet you</h1>
            <h1 class="time"><!--time he1e--></h1> <!-- h1 - fix -->
            <div class="btn">
                <form action="#" method="post">
                    <input class="btn-info" type="submit" value="tell me more">     
                </form>
            </div>
        </div>


/*HEAD*/

.head {
	width: 940px;
	margin: 0 auto;
	padding: 10px 0;
}

.head-logo {
	float: left;
	clear: both;
	margin-left: 5px;
	margin-top: 30px;
	line-height: 0;
}

.menu-wrapper {
	float: right;
	margin-top: 35px;
}

.menu li {
	float: left;
}

.menu li a {
	font-size: 15px;
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	line-height: 0;
	padding: 10px;
	border-radius: 5px;
	margin-right: 23px;
	color: #ffffff;
}

.menu li:last-child a {
	margin-right: 0;
}

.menu li a:hover {
	transition: 0.3s linear;
	background: rgba(0, 0, 0, 0.3);
	color: #fed136;
}

.wel {
	font-size: 40px;
	font-family: Arial, sans-serif;
	margin-top: 235px;
	text-align: center;
	color: #ffffff;
}

h1 {
	font-size: 75px;
	font-family: Arial, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	text-align: center;
	margin-top: 30px;
	color: #ffffff;
}

.time {
	font-size: 35px;
}

.btn {
	text-align: center;
	margin-top: 10%;
}

.btn-info {
	width: 240px;
	height: 65px;
	background: rgba(254, 209, 54, 0.7);
	border: none;
	border-radius: 5px;
	font-size: 24px;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
	color: #ffffff;
}

.btn-info:hover {
	transition: 0.3s linear;
	background: #d4ad28;
}

						/* / HEAD*/
  • Вопрос задан
  • 206 просмотров
Пригласить эксперта
Ответы на вопрос 2
В чем собственно работа? Все прекрасно работает. Что Вы от него собственно ждете?
Ответ написан
Комментировать
@storm-coder Автор вопроса
Если изменить <h1 class="time"> на заголовок второго уровня <h2 class="time"> - не работает.

https://storm-coder.github.io/
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы