Как центрировать divs на css?

Question

Ну, я хочу сосредоточить текст своего баннера и изображение как на psd, но, тем не менее, я попытался с margin: 0 auto, margin: 0 auto 0 auto, и другими вещами, но это не сработало, даже если я использую центр тегов, как я могу его исправить? когда я хочу увидеть мой html на более крупную страницу, он выглядит плохой, а не сосредоточен, я не знаю, что делать, кто-то может мне помочь.

CSS: -

.banner{ 
    width: 100%; 
    height: 500px; 
    background-color: #505a78; 
} 

.banner p{ 
    display: block; 
} 

.banner_text{ 
    color: #fff; 
    padding: 150px; 
} 

.banner_text h1, 
.banner_text h1 span{ 
    font-size: 35px; 
    font-family: 'Montserrat Black'; 
} 

.banner_text .banner_wrap{ 
    margin:0 auto 0 auto; 
    width:auto; 
} 

.banner_text p{ 
    color: #a5abbb; 
    font-family: 'Montserrat Light'; 
} 

.banner_text p > span{ 
    display: block; 
} 

.banner_text a { 
    margin-top: 25px; 
    display: block; 
    color: white; 
    text-align: center; 
    width: 62px; 
    padding: 4px 25px; 
    text-align: center; 
    background-color: #7cdf95; 
    font-weight: bold; 
    font-family: 'Montserrat Black'; 
text-align: center; 
} 

.banner_text img { 
    width: 75%; 
    margin-top: -275px; 
} 

HTML: -

<section class="banner"> 
     <div class="banner_text"> 
      <div class="banner_wrap"> 
       <h1>Lorem ipsum dolor sit amet, <span>consectetur adipiscing elit</span></h1> 
       <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo.<span> Cum sociis natoque penatibus et magnis dis parturient montes, nascetur</span></p> 
       <a href="#">button</a> 
       <img src="img/16251331_10210478393849069_2072529108_o.png" alt=""> 
      </div> 
     </div> 
     </section> 

psd my_html

Answer 1

Попробуйте добавить:

.banner_text .banner_wrap{ 
    margin:0 auto 0 auto; 
    width:50%; 
} 

width:50%; будет центрировать div в середине страницы, если это то, что вы хотите!

Answer 2

Вы устанавливаете Див Центрировать этот путь

margin: auto; 
width: 50%; 

Если вы не установите ширину или установить ширину до 100%, то в DIV никогда не будет центр.

Если вы хотите, чтобы центрировать текст внутри DIV затем использовать

text-align: center 

Если вы хотите отцентрировать изображение, а затем использовать

display: block; 
margin: auto;