Justere div til høyre i Bootstrap 3

Finnes det en måte i Bootstrap 3 å høyrejustere en div?

Jeg er klar over forskyvningsmulighetene, men jeg vil justere en formatert div til høyre for beholderen mens den skal være sentrert i en mobilvisning i full bredde. Klassen ' pull-right' fungerer ikke lenger. Har de glemt å erstatte den, eller går jeg glipp av noe åpenbart?

<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>

Jeg vet hvordan man gjør dette i CSS, men kan det gjøres i ren bootstrap 3?

xnome
Redigerte spørsmål 3. november 2013 в 9:37
Programmering
html css twitter-bootstrap-3
3. november 2013 в 9:24
4 visninger

Klassen pull-right finnes fortsatt i Bootstrap 3. Se 'hjelpeklassene' her.

pull-right er definert av

.pull-right {
  float: right !important;
}

uten mer informasjon om stiler og innhold er det vanskelig å si.

Den trekker definitivt rett i denne JSBIN. når siden er bredere enn 990px - det er da col-md-stylingen slår inn, Bootstrap 3 er mobil først og alt.

Kommentarer (0)

Mener du noe sånt som dette?

**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>

CSS

.yellow-background {
  background: blue;
}

.pull-right {
  background: yellow;
}

Du finner et fullstendig eksempel på Codepen.

g00glen00b
Redigert svar 25. februar 2014 в 8:52
Kommentarer (0)

jeg tror du prøver å justere innholdet til høyre i div, div med offset skyver allerede seg selv til høyre, her litt kode og LIVE-prøve:
FYI: .pull-right skyver bare div til høyre, men ikke innholdet i 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>

CSS:

.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;
}

En annen endring:

...
<div class="yellow_background totheright">
  <span>right content</span>
  <br/>image also align-right<br/>

</div>
...

håper det vil løse problemet ditt

Kommentarer (0)