как выровнять теги li?

238

07 мая 2018, 21:02

Делаю выравнивание всех трех тегов находящихся в одном Враппере, после чего не могу выровнять список, подскажите пожалуйста как сделать. спасибо

<div class="col-md-6 col-xs-12"> 
					<h1>Монтаж систем вентиляции и кондиционирования</h1> 
 
					<ul> 
						<li><i class="fas fa-check"></i>Работаем без предоплаты</li> 
						<li><i class="fas fa-check"></i>скидки до 40%</li> 
						<li><i class="fas fa-check"></i>бесплатный выезд инженера</li> 
					</ul> 
					<a href="" class="button">Отправить заявку</a> 
				</div>

css вот такой

	.header-content 
		text-align: center 
		h1 
			font-size: 28px 
			line-height: 30px 
		ul 
			li 
				font-size: 16px

Answer 1

Скорее всего у вас у родительского блока стоит свойство text-align: center.

Если я правильно понял задачу то вам нужно сделать вот такую структуру html:

<div class='wrapper'>
    <ul>
        <li>Работаем без предоплаты</li>
        <li>Скидки до 40%</li>
        <li>Бесплатный выезд инженера</li>
    </ul>
</div>

И задать стили обёртке в css:

.wrapper {
    text-align: left;
}
.wrapper ul {
  list-style: none;
}

Пример на JSFiddle

Answer 2

теги li по умолчанию прибиты влево, видать проблема в родительском блоке ,посмотри значени text-align

Answer 3

Если я правильно понял, то это можно сделать так:

    .wrapper { 
        text-align: center; 
    } 
     
    .wrapper ul { 
      display: inline-block; 
      text-align: left; 
    }

<div class='wrapper'> 
    <ul> 
        <li>Работаем без предоплаты</li> 
        <li>Скидки до 40%</li> 
        <li>Бесплатный выезд инженера</li> 
    </ul> 
</div>