Spielerei mit neuen Theme

Ich hab mich endlich mal dazu durchgerungen mit einem neuen Theme zu arbeiten, bzw. das bisherige Theme zu ändern. Das war ja der klassische Kubrick nur mit einem eigenen Hintergrundbild, jetzt ist es "flexible Kubrick" - im Prinzip immer noch Kubrick vom Layout her, aber ich hab die runden Ecken und Schatten entsorgt und das ganze Layout auf em umgestellt als Massgabe - nicht mehr feste Pixelbreiten, sondern statt dessen fontrelative Angaben. Mal gucken, eventuell mach ich das Theme später mal verfügbar.

Im Ergebnis müsste das Layout jetzt sich bei Basisfonteinstellungen durch den User anpassen und auch ansonsten etwas gnädiger arbeiten bei entsprechenden Veränderungen. Es ist allerdings immer noch kein liquid Layout, sondern statisch - nur eben mit flexibler Basisgrösse.

Das Problem mit der Kopfgrafik hab ich übrigens ganz klassisch gelöst: der Bagger ist einfach freigestellt und vor transparenten Hintergrund gestellt und als GIF gespeichert. Kombiniert mit der passenden Farbe für den Hintergrund ist das Ergebnis meiner Meinung nach recht brauchbar. Und bei Grössenänderung der Seite (z.B. eben durch Basisfontvergrösserung) "wächst" das Bild in der Breite mit.

Wem seltsame Sachen auffallen, bitte melden. Ich weiss, ist keine layout-technische Revolution. Aber dazu bin ich eh nicht in der Lage. Ich wollte einfach nur mal probieren wie ein em-basiertes Layout ausfallen kann und brauchte dazu was zum probieren. lachendes Gesicht

tags: Wordpress

Kai April 26, 2005, 9:47 p.m.

im internetexplorer ist auf der startseite die rechte leiste ganz nach unten verrutscht.. sie steht zwar rechts (wo sie auch hingehoert), faengt jedoch erst nach dem ende des allerletzten artikels an..
liegt in der regel daran, dass der ie die gesamte breite der beiden divs falsch berechnet (sofern er sich im quirksmodus befindet), diese dadurch zu breit werden und das eine sich unter dem anderen anordnet um zu passen - oooder an einem clear-attribut im stylesheet..


hugo April 26, 2005, 10:03 p.m.

In diesem Fall warscheinlich die Breitenberechnung - der IE berechnet Breiten falsch wenn man padding, margin und width angibt. Benutze ich bei beiden Spalten - da sind Probleme mit dem IE unter Win vorprogrammiert.

Muss ich mir mal morgen angucken wenn ich einen IE direkt im Zugriff habe. Hatte ich schon fast erwartet das der Zicken macht - witzigerweise funktioniert der IE auf dem Mac tadellos. Wie üblich, Microsoft ist nichtmal in der eigenen Produktlinie konsisten ...

hugo April 26, 2005, 11:25 p.m.

Gefunden. Die Ursache war mein Hack für PRE Tags im IE: die kriegen bei mir ja eine feste Breite verpasst, damit die nicht das Layout sprengen (wegen overflow: auto - was der IE nicht korrekt macht). Naja, da stand 40em und die entsprechende DIV ist nur auf 35em ausgelegt :-)

Jetzt sollte es klappen - bei mir siehts gut aus. Ausserdem hab ich noch ein paar Anpassungen gemacht. Die Sidebar ist jetzt mit float: right ausgezeichnet (der Content ist eh schon float: left), dadurch brauche ich der Sidebar keine Margin zu geben. Die passt sich automatisch an. Mit der alten Methode zickte der IE nämlich auch rum.

Und die Breite des Textes bei Einzelartikeln oder Seiten ist jetzt etwas breiter (40em statt 35em), da ja keine Sidebar daneben passen muss.

Jetzt hat allerdings der alte Safari (1.0) Probleme wenn man den Font hochdreht - aber der scheint da eh buggy zu sein. Opera, FireFox, IE tuns jedenfalls. Ich hasse Webbrowser ;-)

Christian Kurusa April 27, 2005, 10:03 a.m.

Sieht gut aus! Das Vergrößern/Verkleinern funktioniert prima auch mit dem Logo.
Bei "runden Ecken" bin ich mir noch nicht sicher ob ich sie gut oder schlecht finde.


Kai April 27, 2005, 11:20 a.m.

Stimmt! Jetzt fängt die Leiste an der Seite auch bei mir wieder oben an.. :)

Marc Stürmer May 1, 2005, 1:09 p.m.

Eine Verbesserungsvorschlag (ansonsten siehts ja sehr nett aus): man sollte Blocksatz in den Überschriften vermeiden. Das führt wie z.B. bei dem Artikel "Ex-Bush-Ministerin Veneman wird UNICEF-Chefin" nur dazu, dass es je nach Überschrift hässliche, ungenutzte Freiräume gibt, da Webbrowser keine Silbentrennung beherrschen. Diese Freiräume stören das ansonsten nette Bild (ich benutze hier Firefox 1.0.3).

hugo May 1, 2005, 1:52 p.m.

Jo, der Blocksatz steht eh schon auf der Abschussliste. Irgendwie halte ich den sowieso für eher überflüssig - ist noch eines der Überbleibsel aus dem Kubrick. Allerdings beim eigentlichen Text ist er dann auch wieder ganz nett - optisch. Mal schauen, im Moment ist erstmal Urlaubsvorbereitung angesagt, da muss das Blog etwas zurückstecken :-)

hugo May 1, 2005, 2:18 p.m.

Habs natürlich doch mal eben geändert. Jedenfalls in den Überschriften erstmal.