Formatierungsproblem mit CSS

smallgrapher · 11.04.2010

Kurze Frage,

ich habe

HTML:

<h2>12.04.2010</h2>
<p>Stadtteilfest Wattenscheid</P><br>
<h2>28.04.2010</h2>
<p>Essen Original</P><br>

<h2> ist per css rot formatiert
.text ist schwarz formatiert

Aber irgendwie sehe ich nur das <p> in schwarz, aber <h2> nicht in rot.

Habe mich nochmals in self-html eingelesen, ein paar Fehler auch abgestellt, aber warum bleibt das noch so?

Was mache ich falsch?

Hier noch der CSS-Code

HTML:

p {
 font-family: Tahoma, Geneva, sans-serif;
 font-size: 11px;
 color: #333;
}
h2 {
 font-family: Tahoma, Geneva, sans-serif;
 font-size: 12px;
 color: af322b;
}

Danke Tom

smallgrapher · 11.04.2010

AW: Formatierungsproblem mit CSS

Wenn ich das ganze in einen <span> setze, geht das. Aber kann ich das mit nem globalen CSS nicht formatieren?

chris_90 · 11.04.2010

AW: Formatierungsproblem mit CSS

Hi Tom,

versuch mal bei h2 vor den Farbwert auch ein "#" zu setzen.

lg
Chris

CrazyRika · 11.04.2010

AW: Formatierungsproblem mit CSS

Mit welchem Programm machst du das?

smallgrapher · 11.04.2010

AW: Formatierungsproblem mit CSS

Jap,
passiert schonmal, dass man nen Zeichen vergisst wa.

Danke für den Hinweis!

@CrazyRika
Mit DreamWaever, code aber fast alles mitlerweile selbst (Naja, ich versuchs zumindest), warum?

fantaflascher · 11.04.2010

AW: Formatierungsproblem mit CSS

Das üblich Problem einfach mal wieder ein Zeichen vergessen. Ich kenne das wenn ich anfange und etwas länger dran hänge dann passiert mir das auch. Setzt vor deine Farbe einfach mal # und dann sollte dein Text die passende Farbe bekommen. Dreamweaver fragt eigenlich schon nach und codes das dann auch passend.

Ranger1281 · 11.04.2010

AW: Formatierungsproblem mit CSS

Hi Tom,

wenn Du selber codest, ist eine andere Struktur im CSS vieleicht hilfreich:

p { font-family: Tahoma, Geneva, sans-serif; color: #333;
}

h2{ font-family: Tahoma, Geneva, sans-serif; color:#af322b;
}

Durch das "Untereinanderschreiben" bestimmter "fixer" Werte, fällt Dir sofort auf, wenn Du ein Zeichen vergisst, da das Zeilenbild sofort verschoben ist. So mache ich das zumindest und habe dadurch schon manchen Fehler gefunden....
In Deinem Beispiel fällt sehr schön auf, das Dein oberer Farbwert um drei Zeichen kürzer ist... ich verwende auch grundsätzlich eine gleichmäßige Farbbennung, also entweder RGB oder HEX nicht aber gemischt...

Solla · 11.04.2010

AW: Formatierungsproblem mit CSS

Hallo smallgrapher,

wenn Du Anfänger bist und noch kein geeignetes Programm hast, würde ich Dir "TopStyle Lite 3" empfehlen, da passieren solche Fehler nicht, da man die Farben bequem über ein Farbfeld auswählt den rest, wie z.B. "#" macht der selbst. Das Tool ist übrigens Freeware und wird auch in H.Chr. Hankes "CSS for Kids" empfohlen - was für eine leichte Bedienbarkeit steht.

B.G. und schönes Wochenende Euch allen
Solla

Pixelverwender · 11.04.2010

AW: Formatierungsproblem mit CSS

In Deinem Beispiel fällt sehr schön auf, das Dein oberer Farbwert um drei Zeichen kürzer ist... ich verwende auch grundsätzlich eine gleichmäßige Farbbennung, also entweder RGB oder HEX nicht aber gemischt...

Er verwendet doch gar keine gemischte Farbbenennung..? RGB wäre "rgb(wert1,wert2,wert3)"
Oder ist mir da was entgangen?

hubspe · 11.04.2010

AW: Formatierungsproblem mit CSS

smallgrapher schrieb:
ich habe

HTML:

<h2>12.04.2010</h2> <p>Stadtteilfest Wattenscheid</P><br> <h2>28.04.2010</h2> <p>Essen Original</P><br>

<h2> ist per css rot formatiert
.text ist schwarz formatiert

das ist schon semantisch nicht so toll.
Wozu brauchst du die <br />? p ist doch ein Blockelement was einen eigenen Absatz macht.

Sowas ist doch eigentlich eine Definitionsliste:

HTML:

<dl>
<dt>12.04.2010</dt>
<dd>Stadtteilfest Wattenscheid</dd>
</dl>

Pixelverwender schrieb:
Er verwendet doch gar keine gemischte Farbbenennung..? RGB wäre "rgb(wert1,wert2,wert3)"
Oder ist mir da was entgangen?

nein, ist schon korrekt.
#333 ist das Gleiche wie #333333 und eine erlaubte verkürzte Schreibweise. Ist aber meistens nicht möglich.

Ranger1281 · 11.04.2010

AW: Formatierungsproblem mit CSS

Hi Pixelverwender,
sorry, dass wollte ich auch nicht behaupten. Ich hatte dies nur im Zusammenhang mit der Übersicht dieser CSS Struktur bermerkt, damit eben die fixen Werte schön gleichmäßig untereinander stehen. Da im obigen Beispiel die Länge der Farbwerte unterschiedlich ist, hab halt eben auch dies kommentiert, weil es eben den Hintergrund dieser Strukturmethode schön verdeutlicht. Wenn das, im Zusammenhang etwas verwurschtelt rüberkam, war das so nicht gewollt, sorry.

Viele Grüße
Ralf

AlexanderBo · 11.04.2010

AW: Formatierungsproblem mit CSS

wie hubspe schon meinte macht <p> </p> n eigenen absatz.
wenn wir schon bei code sind - dann bitte auch nicht
<p> </P> sondern alles kleinschreiben also
<p> </p> denn wir schreiben ja alles klein ;-)
naja... und ma n zeichen vergessen a lá # oder
was mir ja auch gern passiert ist ;
kann schonmal passieren ;-)

smallgrapher · 11.04.2010

AW: Formatierungsproblem mit CSS

hubspe schrieb:
das ist schon semantisch nicht so toll.
Wozu brauchst du die <br />? p ist doch ein Blockelement was einen eigenen Absatz macht.

Weil ich so nur die gewünschte Formatierung erreiche, damit ist der Abstand von <h2> zu <p> genausogroß wie der Abstand von <p> zum nächsten <h2>.
Ich könnte den zwar mit line-height vergrößern, aber nicht mehr verkleinern.

Wenn ich den Abstand zwischen <h2> und <p> verkleinern könnte, würd mir das vollkommen reichen, aber der geht nicht unter einen gewissen Abstand.

Die <dl> ist eine gute Sache, aber das <dd> ist eingerückt, wie könnte ich denn das auch links ausrichten?

<p> </P> sondern alles kleinschreiben also

Ist mir beim abtippen passiert, ich kopiere den code selten hier rein, sondern schreibe ihn nur ab, damit ich ihn weiter verinnerliche kann, aber trotzdem danke für den Hinweis!

Solla · 11.04.2010

AW: Formatierungsproblem mit CSS

Wieso soll das nicht unter einem gewissen Abstand gehen? Du darfst für Abstände doch im Notfall auch negative Werte benutzen!

B.G.
Solla

smallgrapher · 11.04.2010

AW: Formatierungsproblem mit CSS

Genau das hab ich ja probiert, aber der geht nicht oder nur minimal unter einem bestimmt Wert.
Deswegen such ich ja auch nach alternativen, war ja fast mit das Erste was ich ausprobiert habe.

hubspe · 11.04.2010

AW: Formatierungsproblem mit CSS

smallgrapher schrieb:
Weil ich so nur die gewünschte Formatierung erreiche, damit ist der Abstand von <h2> zu <p> genausogroß wie der Abstand von <p> zum nächsten <h2>.
Ich könnte den zwar mit line-height vergrößern, aber nicht mehr verkleinern.

Wenn ich den Abstand zwischen <h2> und <p> verkleinern könnte, würd mir das vollkommen reichen, aber der geht nicht unter einen gewissen Abstand.

Die <dl> ist eine gute Sache, aber das <dd> ist eingerückt, wie könnte ich denn das auch links ausrichten?

Abstände macht man mit padding/margin und nicht mit <br />.

Deine Probleme Abstände anzupassen und das dd links auszurichten kommen durch die Default-Abstände des Browsers.
Du solltest einen CSS-Prolog definieren um die browserinternen Vorformatierungen auf null zu setzen.

smallgrapher · 11.04.2010

AW: Formatierungsproblem mit CSS

Danke, das ist glaub ich genau das was ich brauche. Danke für den Link!

CrazyRika · 14.04.2010

AW: Formatierungsproblem mit CSS

smallgrapher schrieb:
@CrazyRika
Mit DreamWaever, code aber fast alles mitlerweile selbst (Naja, ich versuchs zumindest), warum?

Okay hat sich schon erledigt

sonst hätte ich dir jetzt vorgeschlagen das Du es auch mal mit DW versuchst^^