Servus!
vielen Dank für die Infos und Links. Hier mal die Testseite. Bei einem Zoom von 150% werden die Links nicht mehr bündig dargestellt. Was wäre hierzu der beste Lösungsvorschlag.
Nur, um die Fragestellung präziser zu erfassen: Geht es darum, dass die Links nicht auf der selben Grundlinie stehen, also einen unterschiedlichen Abstand zum unteren Rand der Box haben?
Ich glaube, das ist es, was Christian meint. Das könnte man mit CSS-Grid lösen (statt des footers würde man hier den Link fest am unteren Rand positionieren).
Verwendest du keine Webentwicklertools → Bildschirmgröße testen? Ist es den falsch wenn man dies unter verschiedenen Geräten ansieht?
Nein, genau richtig, so kann man testen, wie es denn dann aussieht.
BTW: Ich würde alles in der Box über die Klasse .box formatieren:
.box {
background-color: white;
width: auto;
margin: 1em;
text-align: center;
}
.box p { /*anstelle von .box-text */
font-size: 0.9em;
padding: 0em 3em 0em 3em;
}
.box a { /* anstelle von article a */
line-height: 4em;
color: #0099CC;
}
Vom HTML her würde ich die Überschriften h2 nehmen, weil du mehrere hast.
@Gunnar Bittersmann Wo, wenn überhaupt, würdest du eine h1 verwenden?
Anstelle des png-Bilds würde ich dein textlastiges Logo in svg erstellen, damit Suchmaschinen den Inhalt erfassen können.
PS: Bei einer Breite von 17em bricht dass Bild aus dem div, bin gerade am Fehlersuchen 😂
Du hast alles in em, im HTML gibt es aber noch feste Breiten- und Höhenangaben:
<img class="bilder" src="" title="" height="154" width="270">
Herzliche Grüße
Matthias Scharwies
Es gibt viel zu tun: ToDo-Liste