Positionieren und kacheln eines Hintergrundbildes
Hallo ins Forum,
ich habe zum testen mal folgende kurze HTML Datei gemacht HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Mit fixen Angaben in Pixel wäre das kein Problem, aber ich erstelle ein elastisches Layout, in dem alle Größen in em notiert. Ein einfaches background: repeat kachelt leider auch nach oben. CSS 3 background-size möchte ich aktuell noch nicht einsetzen. Das Beispiel ist hier online Hat jemand ne Idee, wie ich das realisieren kann? |
du musst deine background-eigenschaften auf "p.unten" setzen...
|
Zitat:
Man kann aber Bereiche mit anderen Elementen verdecken, damit es so aussieht, als ob. Zitat:
Zitat:
|
Hallo nochmal,
hier die Pixellösung. Ganz einfach der Hintergrund blau und oben ein 200 Pixel hoches und mit repeat-x gekacheltes Bild. Am besten zu sehen ist es wohl auf auf der Seite, die ich gerade entwickle. Hier könnt ihr gucken. Wechselt den Style auf Layout 3. Hier sieht man wie es gedacht ist (am besten den aktuellen Firefox benutzen). Ich habe es zur Zeit mit background-size (für den oberen weißen Hintergrund) gemacht, aber wie gesagt, das wollte ich nicht einsetzen. Viele Grüße Steffi |
Aha, so wird das klarer. Deine Gedankengänge bzw. die Zusammenhänge waren oben leider nicht verständlich (denn auch pixelbasierend ändert sich das Verhalten gekachelter Hintergründe nicht.)
Wenn du nichts an der Dokumentstruktur ändern willst: Ein sehr hohes, schmales blaues Bild erstellen. Von oben passend positionieren, horizontal kacheln. Ich kann jedoch nicht nachvollziehen, warum der obere Bereich, der nur aus Bildern besteht, unbedingt schriftgrößenabhängige Höhen braucht. |
Hi nochmal,
na das ging ja schnell mit der Antwort. Vielen Dank erst Mal :) Sorry, dass ich mich zunächst nicht so klar ausgedrückt habe. Zu "Oben". Eigentlich ist nur der Pylon und das linke Log ein Bild. Alles Andere ist Schrift. Btw vielleicht hat jemand noch ne Ahnung warum in Chrome die über Googel Fonts eingebundene Schrift so pixelig ist? Aber das nur am Rande ;) Code umstellen *hmmm* wäre machbar. Wie denkst du? Zweiteilen? Bereich oben (weiß) und unten (blau) und dann jeweils einen Container mit den Breitenangaben (mit class). Ähnlich wie bei YAML? Gruß Steffi |
Zitat:
Bildgrößen, Abstände und Headerhöhe in Pixel wären durchaus machbar. ohne dass großartig etwas bei Schriftvergrößerung zerbricht. Zitat:
Zitat:
Zitat:
Ich kenne YAML nur als Framework für Spaltenlayouts. Ich verstehe deinen Gedankengang nicht. |
Und nochmal :)
Zitat:
Zitat:
Hier ein Vergleich Chrome 10 http://www.it-schoemehl.de/test/af_chrome.jpg FF 8 http://www.it-schoemehl.de/test/af_ff.jpg Vielen Dank an dieser Stelle für deine kompetente Hilfe! So und nun müssen die Kids ins Bett, ich bastel später weiter. CSS macht richtig Laune http://xhtmlforum.de/images/smilies/icon_lol.gif Gruß - mimii p.s. Anregungen und konstruktive Kritik zu der Seite nehme ich gerne entgegen |
Chrome 10? Aktualisieren wäre ein erster Ansatz.
Der Unterschied ist bei mir im aktuellen Chrome unter XP nicht erkennbar. |
Kurze Meldung:
Chrome16 -> keine Verbesserung. Am besten mache ich den Schrifzug als Grafik Danke und viele Grüße mimii |
Alle Zeitangaben in WEZ +2. Es ist jetzt 09:44 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023