Gebruiker:Bmulckhu/kladblok21

Probleem uitlijning

Sterrren en "aantal: " komen in BS4 onder elkaar te staan i.p.v. naast elkaar.

<span style="display: inline-block; width=15%;">
<div class="person-panel-header-rating">
 <span style="white-space:nowrap;">
  <img src="https://test.theaterencyclopedie.nl/w/extensions/SemanticRating/images/greystar.png">
  <img src="https://test.theaterencyclopedie.nl/w/extensions/SemanticRating/images/greystar.png">
  <img src="https://test.theaterencyclopedie.nl/w/extensions/SemanticRating/images/greystar.png">
  <img src="https://test.theaterencyclopedie.nl/w/extensions/SemanticRating/images/greystar.png">
  <img src="https://test.theaterencyclopedie.nl/w/extensions/SemanticRating/images/greystar.png">
 </span>
<span> </span>
<span style="font-size:small;"> (Aantal:0)</span>
</div>
</span>

Het lijkt erop dat de de white-space:nowrap in BS4 niet meer werkt zoals in BS3.

Mogelijke oplossingen

Proging 1

Het gebruik van de class .text-nowrap zie documentatie

Werk niet

Poging 2

Het gebruiken van flex box voor de alignment van de afbeeldingen.