CSS Farbe und Fontgröße funktioniert nur teilweise

LeanderAT

Lt. Junior Grade
Dabei seit
Apr. 2015
Beiträge
464
Hallo!

Ich habe ein Problem...mein Code funktioniert im Browser, nicht aber auf dem Handy, obwohl ich ihn 1:1 kopiert habe und er auf einer anderen Seite von mir funktioniert.

Was Grundsätzliches: Wie kann ich Text anzeigen?

PHP-Datei:
<h1>Hallo, ich bin ein Text</h1>
<small>Hallo, ich bin auch ein Text.</small>

CSS-Datei:

h1
{
font-size: 12px;
color: #000000;
}

small
{
font-size: 12px;
color: #000000;
}

Kann man das beliebig verwenden? Ist es egal, ob ich den Namen h1, h2, h3 nehme oder small, small2, small3...? Oder sind die Begriffe schon eindeutig festhelegt, EGAL, was ich dann in den Code bei Größe und Farbe schreibe?

Im Browser funktioniert <small3>...</small3>, auf dem Handy nicht.

Wenn man nur h1-h6 wählen darf oder small...nicht aber small2, small3 usw., kann man doch so beliebige Namen wählen?

.menuepunkt
{
color: #006600;
font-size: 12px;
font-weight: bold;
margin-top: 0px;
}

<p class="menuepunkt">Das ist auch ein Text.</p>

====

Allerdings funktioniert das auch wieder am Handy nicht und ich weiß nicht warum...
 
Du kannst nicht beliebig Namen für die Tags vergeben. "h1" bis "h6" sind Standard von HTML für die Überschriften, "small" ist einfach nur nen Tag für den Browser der den Text kleiner darstellt. Das würde ich heute nicht mehr unbedingt verwenden, sondern mich lieber auf Klassen an den Tags beziehen. Dann musst du viel "div" und "span" benutzen. "small2" usw. ist dann kein HTML mehr. Was da passiert kann dir dann keiner genau sagen.
 
Zitat von LeanderAT:
Kann man das beliebig verwenden? Ist es egal, ob ich den Namen h1, h2, h3 nehme oder small, small2, small3...? Oder sind die Begriffe schon eindeutig festhelegt, EGAL, was ich dann in den Code bei Größe und Farbe schreibe?
...
Wenn man nur h1-h6 wählen darf oder small...nicht aber small2, small3 usw., kann man doch so beliebige Namen wählen?
Also es gibt in HTML definierte Tags. H1-H6 sind vorhandene Tags, small ebenfalls, small3 gibt es schlichtweg nicht. Mit small wird einfach nur ein kleinerer Text definiert (wie auch immer das CSS-technisch letzten Endes dargestellt wird, steht auf einem anderen Blatt). H1-H6 sind Überschriften in verschiedenen Größen.
Mir kommt es vor, als fehlt es hier noch etwas an Grundwissen, daher würde ich dir den HTML Bereich von W3-Schools empfehlen - anschließend den CSS-Bereich.

Zitat von LeanderAT:
Im Browser funktioniert <small3>...</small3>, auf dem Handy nicht.
Es kann sein das dein Browser auf dem PC den Tag einfach nimmt und versucht etwas draus zu machen, dein Handy das Ganze aber nicht als valides HTML erkennt und daher ignoriert.

Zitat von LeanderAT:
...
Allerdings funktioniert das auch wieder am Handy nicht und ich weiß nicht warum...
Hast du vielleicht am Anfang deiner CSS-Datei eine Media Query o.Ä.? Wie beginnt deine CSS-Datei?
 
Danke. Ich hab gedacht, dass h1... und small halt beliebige Namen sind, damit sich der Ersteller auskennt...es aber egal ist, ob man

h1 = 20 px, h2 = 14px, small = 10px nimmt oder lustigername = 20 px, dooof = 14px, xyz = 10px.

Ja, ich hab tatsächlich ein small2...funktioniert im Browser, aber nicht mit dem Handy. :)
Ergänzung ()

Ok...es geht wieder nicht.

PHP:

<p class="fbtext">Text Text Text</p>

CSS:


.fbtext
{
color: #400080;
font-size: 14px;
margin-top: 0px;
}

Browser alles ok, Firefox-Entwicklertools -> Handyemulator alles ok, aber auf dem Handy wird ein schwarzer Text angezeigt.
 
Zuletzt bearbeitet:
Welchen Browser verwendest Du auf dem Handy? Hast Du auf dem Rechner mit anderen als Firefox getestet?

Allgemein sind die gegebenen Infos nicht ausreichend. Pack am besten ein minimales Beispiel, welches das Problem reproduziert, auf (D)eine Website, dann kann jemand mit Erfahrung vielleicht schnell das entscheidende Detail finden.
 
Danke. Ok...ich mal allen Code gelöscht bis auf diese wenigen...da gings auch nicht, weil der Cache voll war...also den Chrome-Cache gelöscht und es klappte. Dann wieder die normale CSS hochgeladen...und es geht!

Anscheinend hat der Cache immer eine alte Version geladen und nicht die neue. :( Da kann man sich blöd probieren...
 
Zurück
Top