:before-Element hat unnötigen Abstand

[Der fette Mo]

Guten Tag allerseits,

Erst einmal der Link zu der Seite, auf der ihr das Problem sehen könnt:
http://diplomtrottel.pytalhost.com/
(Achtung: Im IE seht ihr bis jetzt nur ungestyltes Markup, also bitte FF oder Opera benutzen!)

Wahrscheinlich seht ihr sofort mein Problem: Die obere Grafik ist ca. 2 Pixel vom Rest entfernt. Ich hatte zuerst collapsing margins im Verdacht, aber daran liegts wohl nicht. (Das Setzen von padding-Werten hat überhaupt nichts gebracht.) Hat jemand eine Idee, wie man das Problem beheben könnte?

Gruß,
Der fette Mo

[Ingo Turski]

Hi,

Ich hatte zuerst collapsing margins im Verdacht, aber daran liegts wohl nicht. (Das Setzen von padding-Werten hat überhaupt nichts gebracht.)

Auch nicht das margin von h1?
Kann ich leider nicht testen, da Deine unübliche Stylesheeteinbindung die Editierfunktion meiner Webdeveloper Toolbar blockiert.

freundliche Grüße
Ingo

[Dennis]

Hi Ingo,

Auch nicht das margin von h1?

Bringt es icht.

Kann ich leider nicht testen, da Deine unübliche Stylesheeteinbindung die Editierfunktion meiner Webdeveloper Toolbar blockiert.

Kann ich nicht nachvollziehen, mit meiner Webdeveloper Toolbar geht es einwandfrei - eventuell mal updaten?

@Mo: Schon mal probiert, die obere Grafik ebenso wie die untere 25px hoch zu machen? Ich habe nämlich das Gefühl, dass der per :before erzeugte Bereich eine Zeilenhöhe hoch ist, und wenn das Bild dann zu kurz ist...

MfG, Dennis.

[Der fette Mo]

Guten Tag allerseits,

Kann ich leider nicht testen, da Deine unübliche Stylesheeteinbindung die Editierfunktion meiner Webdeveloper Toolbar blockiert.

Kann ich nicht nachvollziehen, mit meiner Webdeveloper Toolbar geht es einwandfrei - eventuell mal updaten?

bei meiner Web Developer Toolbar funktionierts auch.

@Mo: Schon mal probiert, die obere Grafik ebenso wie die untere 25px hoch zu machen? Ich habe nämlich das Gefühl, dass der per :before erzeugte Bereich eine Zeilenhöhe hoch ist, und wenn das Bild dann zu kurz ist...

Genau das wars (siehe Post von Gunnar). Danke für eure Hilfe!

Gruß,
Der fette Mo

[Gunnar Bittersmann]

Hello out there!

Wahrscheinlich seht ihr sofort mein Problem: Die obere Grafik ist ca. 2 Pixel vom Rest entfernt. Ich hatte zuerst collapsing margins im Verdacht, aber daran liegts wohl nicht.

Ändere mal die Schriftgröße, dann kommst du auf einen anderen Verdacht.

html {min-width: 706px}

Isch ’abe gar kein 706 Pixel breiten Viewport.

Die mit Kombination body {width: 700px} führt wohl dazu, dass nicht einmal ein horizontaler Scrollbalken angeboten wird: deine Seite ist unbenutzbar.

See ya up the road,
Gunnar

PS: “ca_t_egory” nicht lispeln!

[Gunnar Bittersmann]

Hello out there!

Ändere mal die Schriftgröße, dann kommst du auf einen anderen Verdacht.

... der sich bestätigt hat. Allerdings hilft 'display: block' allein auch nicht, du musst noch die Höhe angeben.

Warum bindest du das Bild aber über 'body:before' ein, und nicht einfach als Hintergrundbild von h1? (Entsprechendes für den unteren Abschluss)

See ya up the road,
Gunnar

[Der fette Mo]

Guten Tag allerseits,

Warum bindest du das Bild aber über 'body:before' ein, und nicht einfach als Hintergrundbild von h1? (Entsprechendes für den unteren Abschluss)

Weil ich das Hintergrundbild von h1 wahrscheinlich noch brauche (es kommen wohl noch ein paar Bilder dazu).

Danke für deine Hilfe!

Das Problem mit dem Scrollbalken habe ich übrigens schon bemerkt, bin nur wegen dem problem mit dem :before-Element noch nicht dazu gekommen, mich damit zu beschäftigen. Werde das natürlich schnellstmöglichst beheben (sonst kann ich auf einem meiner beiden PCs die Site nämlich auch nicht benutzen ;) ).

Gruß,
Der fette Mo