ps design (slices), php (dynamischer inhalt), css gestaltung
Soo Leute..
jetzt bin ich mit meinem Latein am Ende. Ich find nach mehreren Tagen Suche keine Lösung mehr und die Ideen sind mir auch ausgegangen. Vielleicht sollte ich vorweg sagen, dass ich keine Ahnung habe, wie ich mein Vorhaben angehen soll. Ich weiß nur, dass es irgendwie realisierbar ist. Also bitte verzeiht, wenn es einen viel sinnvolleren Lösungsweg gibt. Ich benutze Firefox 1.5.0.3... sollte am Ende aber auf allen großen Browsern laufen. sry, für das wirrwarr im code. die folge von ganz viel ausprobieren... ich weiß, da lässt sich noch einiges im CSS Code vereinfachen.. aber ich bin ja gerad noch in der Entwicklungsphase... Preview: klick Das design ist mit photoshop gemacht.. danach gesliced... das Problem liegt darin, dass ich die Boxen nicht so hinbekomme, dass sie sich dem Inhalt anpassen. In die mittlere Box soll nen Newscript nur die Rahmenlinien (Grafiken) passen sich bei meinem Code nicht der länge des Textes an... ich bekomm's nicht hin :/ Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Code:
div#center { |
Tja der Ruf eines Verzweifelten... wie oft ereilt er uns....
Erstmal Willkommen hier. Photoshop ist nur für die Headergrafik nötig, der Rest geht prima mit einfachem CSS. Ich habe deinen Code nur überflogen und das meine ich so, er ist viel zu lang. Und du hast Milliarden von Div's, unnötig. Die Headergrafik kommt in einen div, klar. Der Rest ist dreispaltig. Code:
<body bgcolor=#FFFFFF leftmargin=0 topmargin=0 marginwidth=0 marginheight=0> Das geht so: http://www.xhtmlforum.info/wiki/inde...leml%C3%B6sung ( klein noch, aber man kann mitarbeiten) Du hast nach deiner Grafik Elemente mit Rahmen. Ja, warum auch nicht. Für mich würde sich folgendes anbieten: (nur ein Beispiel) Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> grüsse |
hehe.. wieso einfach, wenn's auch schwierig geht..
ursprünglich sollte das design auch nicht so schlicht sein.. und unterwegs ist mir dann die Idee verloren gegangen, dass man es auch ohne ps machen kann. auch wenn es fix gemacht ist.. mehr brauch ich ja nicht.. jetzt hab ich endlich wieder Ideen.. ich probier das ganze dann mal nach deinem Beispiel umzusetzen.. hab nen gutes Gefühl, dass es klappen könnte. ich meld mich wieder. :D |
hmm.. jetzt wollte ich die div-element mit position: absolute; ausrichten.. allerdings funzt das mit den wrapper dann nicht mehr.. ne idee!?
mit position: relative; richtet er sich am header div-element aus... prinzipiell ginge das so. Die Frage ist jetzt nur, wie sich das bei verschiedenen Auflösungen verhält. Eigentlich müsste es ja funzen, wenn es sich am header ausrichtet.. der ist ja immer zentriert. hier mal zum gucken.. wie das design aussehen soll: klick |
Finger weg von absoluten Positionierungen. andir hat dir so eine schöne Lösung nur mit floats gebaut, genau so solltest du auch weiter machen. ;)
|
Das ist doch ganz einfach.
#wrapper bekommt ebenfalls einen border, ausser links. #footer unten und rechts keinen, dafür schließt er bündig mit #wrapper ab. Für den "umlaufenden" Effekt empfehle ich Dir eine kleine weiße Grafik in der Breite des Hauses zu nehmen, diese in #header zu packen und per negativem margin-bottom vom header raushängen zu lassen, so dass die Linie unterbrochen scheint. Wenn Du Elemente innerhalb eines Elements absolut ausrichten willst, musst Du dem Elternelement ein position: relative mitgeben. Für die kleine Grafik wäre position:absolute das einfachste. (bottom: 0; left: 0; margin-bottom: -2px;) #header bekommt dann position: relative, damit das auch klappt. Ups, wenn zusätzliche border hinzukommen, muss das bei der pixelbreite der Elemente berücksichtigt werden ;) grüsse |
sry... ich versteh nicht genau, wie du das alles meinst...ich weiß nicht was du mit "umlaufenden Effekt" und kleine Grafik.. und wieso sollte der wrapper nen rand außer links bekommen? das entspräche doch überhaupt nicht meiner preview!?
edit: aah o.k. ich glaub ich weiß jetzt in etwas wie du das meinst.. mal ausprobieren edit2: o.k... das mit dem rand unter dem header hab ich hinbekommen.. hab's noch viel einfacher gehabt, als du beschrieben hast. Ich hatte doch schon ne grafik, die ich gesliced hatte.. brauchte die mit margin-bottom einfach nur positionieren.. sieht perfekt aus! worüber ich mir derzeit noch gedanken mache ist, wie ich die zweite box links positioniert bekomme... der inhalt ist auch dynamisch, ebenso der inhalt der menübox. edit3: das mit dem Rahmen rechts klappt nicht so ganz... weil der Rahmen ja nicht ganz außen ist sondern ca. 12px nach innen verschoben ist... und mit grafik einfügen sieht's schlecht aus, weil die länge sich ja anpassen muss.. jemand ne idee.. wie ich das lösen kann!? |
keiner ne idee!? :/
|
Wie wärs mit einem kleinen Online-Beispiel?
Niemand weiss, wo du grade bist. grüsse |
|
Alle Zeitangaben in WEZ +2. Es ist jetzt 11:54 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023