Есть ли способ в Bootstrap 3, Чтобы правильно выровнять див?
Я знаю взаимозачет possibilitys но я хочу, чтобы выровнять отформатирован див справа от своего контейнера, пока она должна быть сосредоточена в мобильный вид на всю ширину. Класс 'тянуть-вправо' больше не работает. Разве они забыли заменить его или я упускаю что-то очевидное?
<div class="row">
<div class="container">
<div class="col-md-4">
left content
</div>
<div class="col-md-4 col-md-offset-4">
<!-- The next div has a background color and its own paddings and should be aligned right-->
<!-- It is now in the right column but aligned left in that column -->
<div class="yellow_background">right content</div>
</div>
</div>
</div>
Шур я знаю, как сделать это в CSS, но можно ли это сделать в чистый бутстрап 3?
Класс тяги-правая все еще есть в Bootstrap 3 Увидеть 'вспомогательные классы' здесь
тянуть-право определяется
.pull-right {
float: right !important;
}
без более подробную информацию по стилям и материалам, это'ы трудно сказать.
Его определенно тянет в этот JSBIN если страница шире, чем 990px - когда коль-МД стиль умирает, Бутстрап 3 быть мобильным во-первых и все.
Вы имеете в виду что-то вроде этого:
В формате HTML
<div class="row">
<div class="container">
<div class="col-md-4">
left content
</div>
<div class="col-md-4 col-md-offset-4">
<div class="yellow-background">
text
<div class="pull-right">right content</div>
</div>
</div>
</div>
</div>
УСБ
.yellow-background {
background: blue;
}
.pull-right {
background: yellow;
}
Полный пример можно найти на сайт CodePen.
я думаю, что вы пытаетесь выровнять содержимого в элемент div, div с уже смещенной пробиться справа, здесь какой-то код и живой пример:
<БР/>к вашему сведению: .тянуть-право
только толкать див справа, но не контент внутри div.
HTML-код:
<div class="row">
<div class="container">
<div class="col-md-4 someclass">
left content
</div>
<div class="col-md-4 col-md-offset-4 someclass">
<div class="yellow_background totheright">right content</div>
</div>
</div>
</div>
Усс:
.someclass{ /*this class for testing purpose only*/
border:1px solid blue;
line-height:2em;
}
.totheright{ /*this will align the text to the right*/
text-align:right;
}
.yellow_background{
background-color:yellow;
}
Другая модификация:
...
<div class="yellow_background totheright">
<span>right content</span>
<br/>image also align-right<br/>
<img width="15%" src="https://www.google.com/images/srpr/logo11w.png"/>
</div>
...
надеюсь, что это очистит вашу проблему.
Прихлоп 4+ внесены изменения в служебные классы для этого. От документация:
добавлен.поплавок-{см,МД,ЛГ,ХL}-{влево,вправо,нет}
классы для чувствительных поплавков и удаленных.тяни-влево "и".тянуть-вправо
, так как они излишне.поплавка-влево "и".поплавок-право
.
Так что используйте .поплавок-право
(или эквивалент размера, такие как .поплавок-ЛГ-право
) вместо .потяните правый
для ваших выравнивание по правому краю если вы're с помощью новой версии загрузчика.
Добавить offset8 к вашему классу, например:
<div class="offset8">aligns to the right</div>