Sådan justerer du et billede midt i midten med bootstrap

Jeg bruger bootstrap-rammen og forsøger at få et billede centreret vandret uden held..

Jeg har prøvet forskellige teknikker såsom at opdele 12 grid systemet i 3 lige store blokke f.eks.

<div class="container">
    <div class="row">
      <div class="span4"></div>
      <div class="span4"><img src="logo.png" /></div>
      <div class="span4"></div>
    </div>
</div>

Hvad'er den nemmeste metode til at få et billede centreret i forhold til siden?

GEOCHET
Redigeret spørgsmål 2014ør maj 2014 в 10:11
Programmering
css twitter-bootstrap
2012ør juni 2012 в 10:40
7 visninger

Twitter bootstrap har en klasse, der centrerer: .pagination-centered

Det virkede for mig at gøre:

<div class="row-fluid">
   <div class="span12 pagination-centered">![header](header.png)</div>
</div>

css for klassen er:

.pagination-centered {
  text-align: center;
}
Kommentarer (2)

Hvis der ikke er andet ved siden af billedet, er den bedste måde at bruge text-align: center i img overordnet:

.row .span4 {
    text-align: center;
}

Rediger

Som nævnt i de andre svar kan du tilføje bootstrap CSS-klassen .text-center til det overordnede element. Dette gør præcis det samme og er tilgængeligt i både v2.3.3 og v3

My Head Hurts
Redigeret svar 2013ør oktober 2013 в 8:18
Kommentarer (4)

Du kan ændre CSS'en i den tidligere løsning som nedenfor:

.container, .row { text-align: center; }

Dette skulle også centrere alle elementerne i den overordnede div.

Kommentarer (0)