molily: Link in <div> funktioniert nicht

Beitrag lesen

Hallo,

<p class="blaettern">

<a class="zurueck" href="">April</a>
  <a class="weiter" href="">Juni</a>
</p>


>   
> ~~~css

.blaettern a {  

>   display: inline-block;  
>   width: 50%;  
> }

Das ist so nicht zu empfehlen. display: inline-block ist leider sehr tückisch:

50% + 50% + die drei Textknoten zwischen den Tags, die anonymous inline boxes erzeugen, ergeben zusammen mehr als 100%. Somit liegen die Elemente nicht mehr in einer Zeile.

float ist hier in dieser Hinsicht besser. Dann muss man sich aber mit Clear/Clearfixes beschäftigen.

Yadgar hat schon nicht unrecht: CSS-Layout ist nicht einfach. Wir kämpfen seit 10 Jahren damit, »mal eben« Spalten robust in CSS umzusetzen. (Jetzt kommt mir nicht mit Flexbox: Das ist noch tausendmal komplizierter – und leistungsfähiger natürlich.)

Mathias