Leere Spannen bewegen andere Spannen nach oben

Question

<span style="float:left; padding-right: 5px;"> 
    <span style="display:block;">Harvard</span> 
    <span>John Smith</span> 
    </span> 

    <span style="float:left; padding-right: 5px;"> 
    <span style="display:block;">Chicago</span> 
    <span>Tucker Max</span> 
    </span> 

    <span style="float:left; padding-right: 5px;"> 
    <span style="display:block;"></span> 
    <span>Rihanna</span> 
    </span> 

    <span style="float:left; padding-right: 5px;"> 
    <span style="display:block;">NYU</span> 
    <span>Peter Simpson</span> 
    </span> 
//... and many more 

Die erste Spanne enthält die Universität, die zweite Spanne enthält den Namen der Person. Jetzt ist mein Problem, dass wenn ich jemanden habe, der nicht zur Uni gegangen ist, möchte ich es einfach leer lassen.

Aber wenn ich das tue, bewegt sich der Name der Person nach oben und ist nicht mehr mit den anderen Namen ausgerichtet. Also in meinem Beispiel bewegt sich Rihanna auf:

ich so etwas wie - oder no uni schreiben könnte, aber ich würde viel ein leeres Feld gibt es vorziehen, als nur mehr ordentlich. Ich würde auch viel lieber eine CSS-basierte Lösung haben.

Edit: Wenn Leute dies ablehnen, lassen Sie mich wissen, warum zumindest.

Answer 1

<span style="float:left; padding-right: 5px;"> 
    <span style="visibility:hidden;">&nbsp</span><!-- Change is in this line --> 
    <span>Rihanna</span> 
</span> 

Sie können den Stil "Sichtbarkeit: Versteckt" verwenden. Auf diese Weise wird die Höhe/Breite aus der Spannweite weiterhin verwendet, während das Element ausgeblendet wird.