Schriftgröße ändern bei Bildschirmgröße kleiner 640 px

1 krieger (Gast)

Hallo,
Ich habe das Problem das die Schriftgröße in der linken Navigaion zu klein ist bei einer Bildschirmgröße "kleiner 640 px" ich bekomme das nicht im Griff.
https://www.fahrrad-workshop-sprockhoevel.de/mtb-trekkingrad-workshop.htm
Was mache ich verkehrt?

2 Jörg Kruse

Die komprimierte CSS-Datei lässt sich leider nur schwer lesen.

Was genau hast du denn probiert?

Die Anpassung der Schriftgröße musst du in einem Block unterbringen, der durch eine entsprechende Media Query definiert ist:

@media (max-width: 639px) {
    .nav-box a {
        font-size: 14px;
    }
}

3 krieger (Gast)

Die CSS-Datei dürfte nicht mehr komprimiert sein.
Ich habe das wie folgt eingegeben:
.nav-box a{
font-size: 15px;
font-weight: bold;
}
.nav-box li {
overflow: auto;
line-height: 160%;
text-align: left;
font-size: 15px;
}
------------------------------------------
Die Schriftgröße wird aber kleiner dargestellt.

4 Jörg Kruse

Ich habe das wie folgt eingegeben:
.nav-box a{
font-size: 15px;
font-weight: bold;
}

In welcher Datei hast du das eingegeben? in den beiden per <link> eingebundenen CSS-Dateien ist der Abschnitt nicht enthalten.

Abgesehen davon fehlt zu dieser Zeile die schließende Klammer:

@media (max-width: 640px){

Die Klammer sollte (spätestens) vor dem nächsten Media-Query-Block geschlossen werden:

@media (max-width: 480px){

5 krieger (Gast)

Das steht in der responsive.css:
@media (max-width: 640px){
p {
font-size: 15px;
}
a {
font-size: 15px;
}
#main > header {
height: auto;
}
#nav-main .row-1 a, #nav-main .row-2 a {
font-size: 15px;
}
#nav-main {
margin-bottom: 10px;
height: 220px;
}
#nav-main > div > a {
display: block;
}
#nav-main .row-1 {
height: 110px;
letter-spacing: 3px;
}
#nav-main .row-1 a {
margin-right: 0;
}
#nav-main .row-2 {
height: 110px;
letter-spacing: 2px;
}
.nav-box a{
font-size: 15px;
font-weight: bold;
}
.nav-box li {
overflow: auto;
line-height: 160%;
text-align: left;
font-size: 15px;
}

6 Jörg Kruse

Nachdem ich die Datei mit Strg + R aktualisiert habe, ist der Abschnitt enthalten.

Es fehlt aber auch hier die schließende Klammer des Media-Query-Blocks.

7 krieger98

Vielen Dank für den Hinweis.
Ich habe das Problem gelöst.
Der Fehler waren dass zwei "ccs-befehle" vorhanden waren:
In der responsive.css stand:
.nav-box a {
display: block;
float: left;
width: 175px;
}
------------------------------------------------
In der responsive-workshop1.css stand folgendes:
.nav-box a {
width: 200px;
font-size: 11px;
}
----------------------------------------------------------
Dieser Befehl wurde abgearbeitet es gibt aber keine Anweisung
für Bildschirmgröße 640 px:

nach oben

Schriftgröße ändern bei Bildschirmgröße kleiner 640 px

Beitrag schreiben (als Gast)

Verwandte Themen