Не работает ntn-child правильно - HTML и CSS

kola7007 · 02.12.2017, 10:33

Не работает ntn-child правильно!
HTML:

Код:


<!DOCTYPE html>
<html lang="en">
    <head>
		<meta charset="UTF-8">
		<title>Golden</title>
		<link href="css/main.css" rel="stylesheet" type="text/css">
	</head>
	<body>
		<header>
			<div class="container">
				<div class="heading clearfix">
					<img src="img/logo.png" alt="Golden" class="logo">
					<nav>
						<ul class="menu">
							<a href="#"><li>Home</li></a>
							<a href="#"><li>Service</li></a>
							<a href="#"><li>Portfolio</li></a>
							<a href="#"><li>About</li></a>
							<a href="#"><li>Contact</li></a>
						</ul>
					</nav>
				</div>
				<div class="titles">
					<div class="titles__first">
						Welcome To Our Studio!
					</div>
					<h1>
						It's nice to Meet you
					</h1>
				</div>
				<a class="button" href="#">Tell Me More</a>
			</div>
		</header>
		<section id="services">
			<div class="container">
				<div class="title">
					<h2>Services</h2>
					<p>Proin iaculis purus consequat sem cure.</p>
				</div>
				<div class="services clearfix">
					<div class="services__item">
						<img src="img/icon1.png" alt="Услуга">
						<h3>E-Commerce</h3>
						<p>Proin iaculis purus consequat sem cure digni ssim. Donec porttitora entum suscipit aenem rhoncus posuere odio in tincidunt.</p>
					</div>
					<div class="services__item">
						<div class="services__item2">
							<img src="img/icon2.png" alt="Услуга">
							<h3>Responsive Web</h3>
							<p>Proin iaculis purus consequat sem cure digni ssim. Donec porttitora entum suscipit aenem rhoncus posuere odio in tincidunt.</p>
						</div>
					</div>
					<div class="services__item">
						<img src="img/icon3.png" alt="Услуга">
						<h3>Web Security</h3>
						<p>Proin iaculis purus consequat sem cure digni ssim. Donec porttitora entum suscipit aenem rhoncus posuere odio in tincidunt.</p>
					</div>
				</div>
			</div>
		</section>
		<section id="portfolio">
			<div class="container">
				<div class="title">
					<h2>Our Portfolio</h2>
					<p>Proin iaculis purus consequat sem cure.</p>
				</div>
				<div class="works clearfix">
					<img src="img/img1.jpg" alt="Работа">
					<img src="img/img2.jpg" alt="Работа">
					<img src="img/img3.jpg" alt="Работа">
				</div>
			</div>
		</section>
		<section>
			<div class="container"></div>
		</section>
		<footer>
			<div class="container"></div>
		</footer>
	</body>
</html>

CSS:

Код:


body{
	font-family: Arial, sans-serif;
	margin: 0px;
	padding: 0px;
	color: #222222;
}
.clearfix:after{
	content: '';
	display: table;
	width: 100%;;
	clear: both;
}
div{
	box-sizing: border-box;
}
header{
	background: url(../img/first-bg.jpg) no-repeat center top / cover;
	padding-bottom: 160px;
}
.container{
	width: 930px;
	margin: 0px auto;
}
.logo{
	margin-top: 41px;
	float: left;
}
nav{
	float: right;
	margin-top: 50px;
}
.menu{
	padding: 0;
	margin: 0;
	display: block;
}
.menu li{
	float: left;
	display: block;
	margin-right: 41px;
}
.menu a{
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
}
.titles__first{
	font-size: 40px;
	color: #fff;
	text-align: center;
	margin-top: 180px;
}
h1{
	font-size: 70px;
	color: #fff;
	text-align: center;
	margin: 15px;
}
.button{
	background: #fed136;
	color: #484543;
	border-radius: 3px;
	display: block;
	width: 240px;
	padding: 20px 0;
	margin: 0px auto;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 18px;
	margin-top: 50px;
}
.title{
	padding-top: 115px;
}
.title h2{
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
	margin: 0;
}
.title p{
	color: #777777;
	text-align: center;
	font-size: 16px;
	margin-top: 5px;
}
.services{
	margin-top: 50px;
}
.services__item{
	width: 270px;
	float: left;
	text-align: center;
}
.services__item h3{
	font-size: 18px;
	margin-bottom: 5px;
}
.services p{
	color: #777777;
	font-size: 14px;
	line-height: 1.55em;
}
.services__item:last-child {
	float: right;
}
.services__item2 {
	margin-left: 60px;
}
#portfolio{
	background: #f7f7f7;
	padding-bottom: 120px;
}
#services{
	padding-bottom: 120px;
}
.woeks{
	margin-top: 
}
.works img{
	float: left;
}
.works img:ntn-child(2){
	margin-left: 29px;
}
.works img:last-child {
	float: right;
}

Нужно выбрать 2 элемент.
http://prntscr.com/hi0y23

olegK<< · 02.12.2017, 19:00

Может потому что ошибка в синтаксиса в правиле сверху ?

Цитата:

Сообщение от kola7007

.woeks{ margin-top: }

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Не правильно работает	HaKeRR	Общие вопросы C/C++	1	02.01.2015 18:10
Не правильно работает кнопка...	FleXik	Общие вопросы Delphi	5	13.02.2013 03:24
Не работает правильно!!!	Vitalik1	Помощь студентам	2	01.11.2011 23:11
Не правильно (или правильно?) работает позиционирование в WebKit	mutabor	HTML и CSS	5	09.12.2010 10:54
программа работает. правильно ли?	getUp	Общие вопросы C/C++	10	26.03.2010 08:07

Опции темы
Версия для печати Отправить по электронной почте