Bootstrap 4 img-circle Klasse funktioniert nicht

75

Ich schreibe eine Website in HTML5 und Bootstrap 4 und versuche, ein quadratisches Bild in einen Kreis zu verwandeln. In Bootstrap 3 war dies problemlos möglich .img-circle, aber jetzt kann ich es scheinbar nicht zum Laufen bringen und kann online keine Antworten finden. Hat Bootstrap die img-circle-Klasse gelöscht oder ist mein Code durcheinander?

Es geht ungefähr so:

<!-- Within a tab-content div --> 
<div class="col-xs-7">
    <img src="img/gallery2.JPG" class="img-circle" alt="HelPic>
</div>

Hoffe jemand kann mir helfen :)

Cal Courtney
quelle

Antworten:

164

Es heißt jetzt rounded-circlewie hier in den BS4-Dokumenten erklärt

<img src="img/gallery2.JPG" class="rounded-circle">

Demo

Zim
quelle
6
aber das ist kein Kreis. Ist es nicht oval?
Shahzad Latif
19
Wenn das Bild nicht quadratisch ist, ist es oval.
Zim
4

In Bootstrap 4 wurde es in .rounded-circle umbenannt

Verwendung :

<div class="col-xs-7">
    <img src="img/gallery2.JPG" class="rounded-circle" alt="HelPic>
</div>

Siehe Migration docs von Bootstrap.

Sisindry Medagam
quelle
1

Jetzt ist die Klasse das

 <img src="img/img5.jpg" width="200px" class="rounded-circle float-right">

Irving Jaime Salgado Linares
quelle