Я використовую фреймворк bootstrap і безуспішно намагаюся відцентрувати зображення по горизонталі...
Я спробував різні методи, такі як розділення системи 12 сіток на 3 рівні блоки, наприклад
<div class="container">
<div class="row">
<div class="span4"></div>
<div class="span4"><img src="logo.png" /></div>
<div class="span4"></div>
</div>
</div>
Який найпростіший спосіб відцентрувати зображення відносно сторінки?
У бутстрапі Twitter є клас, який центрує: .pagination-centered
У мене це спрацювало:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
Css для класу наступний:
.pagination-centered {
text-align: center;
}
Якщо припустити, що поряд із зображенням немає нічого іншого, найкращим способом є використання text-align: center
в батьківському елементі img
:
.row .span4 {
text-align: center;
}
Редагувати
Як згадувалося в інших відповідях, ви можете додати до батьківського елементу клас CSS bootstrap .text-center
. Це робить те ж саме і доступно як в v2.3.3, так і в v3