It is necessary that the pictures were in the center , but everything does not work out ...

* { font-family: 'Planet N', arial; text-decoration: none; } /* ВЕРХНЯЯ ПАНЕЛЬ (ПОЛОСКА)*/ .clearfix:after { content: ''; display: table; width: 100%; clear: both; } body { margin: 0 auto; padding: 0; } div { box-sizing: border-box; } header { background: url(../img/1.jpg) no-repeat center top / cover; height: 100vh; } .container { width: 930px; margin: 0 auto; } .logo { margin-top: 41px; float: left; } nav { float: right; margin-top: 45px; } .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-transform: uppercase; text-align: center; margin-top: 150px; } h1 { font-size: 75px; color: #fff; text-transform: uppercase; text-align: center; margin: 15px; padding-top: 60px; } .button { background: #fed136; color: #484543; border-radius: 3px; display: block; width: 240px; padding: 20px 0; margin: 0 auto; text-decoration: none; text-align: center; text-transform: uppercase; font-weight: bold; font-size: 25px; margin-top: 50px; } .title { padding-top: 115px; } .title h2 { font-size: 40px; font-weight: bold; text-transform: uppercase; margin: 0; text-align: center; } .title p { color: #777777; font-size: 20px; text-align: center; margin-top: 10px; } .servises_item { width: 270px; float: left; text-align: center; } .servises_item p { color: #777777; font-size: 20px; line-height: 1.9em; } .servises_item h3 { font-size: 18px; margin-bottom: 15px; } .servises_item:last-child { float: right; } .servises_item:nth-child(2) { margin-left: 60px; } .servises { margin-top: 80px; } #portfolio { background: #F7F7F7; padding-bottom: 120px; } #servises { padding-bottom: 120px; } .works img { float: left; } .works img:last-child { float: right; } .works img:nth-child(2) { margin-left: 23px; } .humble { margin-top: 80px; width: 200px; text-align: center; } .humble_item p { color: #777777; font-size: 15px; } .humble h2 { font-size: 15px; } .humble_item img { margin-right: 200px; } footer { text-align: center; padding-top: 100px; } 
 <section id="humble"> <div class="container"> <div class="title"> <h2>Обо мне</h2> <p> Сейчас придумаю ... </p> </div> <div class="humble clearfix"> <div class="humble_item "> <img src="assets/img/about1.jpg"> <img src="assets/img/about2.jpg"> <img src="assets/img/about3.jpg"> </div> <div class="humble_item"> <h2>July 2010</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> <div class="humble_item"> <h2>Junaty 2011</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> <div class="humble_item"> <h2>december 2012</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> </div> </div> </section>

    2 answers 2

    I did not understand how and with respect to what "in the center" you need. If you replace your line

     .humble_item img{margin-right:200px;}

    on

     .humble_item img{width:100%;height:100%;}

    so located?

     ? так по центру : 

     *{font-family: 'Planet N', arial;text-decoration: none;} /* ВЕРХНЯЯ ПАНЕЛЬ (ПОЛОСКА)*/ .clearfix:after { content:''; display:table; width:100%; clear:both; } body{margin: 0 auto;padding: 0;} div { box-sizing: border-box; } header { background: url(../img/1.jpg) no-repeat center top / cover; height: 100vh; } .container { width: 930px; margin: 0 auto; } .logo { margin-top: 41px; float: left; } nav { float: right; margin-top: 45px; } .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-transform: uppercase; text-align: center; margin-top: 150px; } h1 { font-size: 75px; color: #fff; text-transform: uppercase; text-align: center; margin: 15px; padding-top: 60px; } .button{background: #fed136; color: #484543; border-radius: 3px; display: block; width: 240px; padding: 20px 0; margin: 0 auto; text-decoration: none; text-align: center; text-transform: uppercase; font-weight: bold; font-size: 25px; margin-top: 50px;} .title{padding-top: 115px;} .title h2{font-size: 40px;font-weight: bold;text-transform: uppercase;margin: 0; text-align: center;} .title p{color:#777777;font-size: 20px;text-align: center;margin-top: 10px;} .servises_item{width: 270px;float:left; text-align: center;} .servises_item p{color:#777777;font-size: 20px;line-height: 1.9em;} .servises_item h3{font-size: 18px;margin-bottom: 15px;} .servises_item:last-child{float: right;} .servises_item:nth-child(2){margin-left: 60px;} .servises{margin-top: 80px;} #portfolio{background: #F7F7F7;padding-bottom: 120px;} #servises{padding-bottom: 120px;} .works img{float: left;} .works img:last-child{float: right;} .works img:nth-child(2){margin-left: 23px;} .humble{margin-top: 80px;width:200px; text-align: center;} .humble_item p{color:#777777;font-size: 15px;} .humble h2{font-size: 15px;} /* Заменил и добавил цвет для наглядности. */ /* .humble_item img{margin-right:200px;} */ .clearfix, .humble_item img{width:100%;height:100%;background-color:lightgreen;} footer {text-align: center;padding-top:100px;} 
     <body> <section id="humble"> <div class="container"> <div class="title"> <h2>Обо мне</h2> <p>Сейчас придумаю ...</p> </div> <div class="humble clearfix"> <div class="humble_item"> <img src="http://www.syntaxxx.com/wp-content/uploads/2014/01/intro-to-css3-logo-300.png"> <img src="http://www.syntaxxx.com/wp-content/uploads/2015/01/08-WP-Auto-Affiliate-Links-580x180.jpg"> <img src="http://www.syntaxxx.com/wp-content/uploads/2015/01/introduction-to-mobile-design-usability-580x435.jpg"> </div> <div class="humble_item"> <h2>July 2010</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> <div class="humble_item"> <h2>Junaty 2011</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> <div class="humble_item"> <h2>december 2012</h2> <h2>Our humble beginnigs</h2> <p>TUTA PEZDA WASHE</p> </div> </div> </div> </section> </body>

    Your example didn’t look normal, as the pictures have a disability path, but if you need to place some blocks in the center of the screen, you can do so.

     .container { display: flex; flex-direction: column; align-items: center; width: 100%; } .item { background-color: green; width: 200px; height: 100px; margin: 4px; } 
     <div class="container"> <div class="item">1</div> <div class="item">2</div> <div class="item">3</div> <div class="item">4</div> <div class="item">5</div> </div>