• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Viele hassen ihn, manche schwören auf ihn, wir aber möchten unbedingt sehen, welche Bilder Ihr vor Eurem geistigen Auge bzw. vor der Linse Eures iPhone oder iPad sehen könnt, wenn Ihr dieses Wort hört oder lest. Macht mit und beteiligt Euch an unserem Frühjahrsputz ---> Klick

CSS Positionierung von FORM Element; vertikale Zentrierung von Text in einem DIV

pepi

Cellini
Registriert
03.09.05
Beiträge
8.740
Ich bastle momentan wieder mal an einer Webseite die irgendwann mal online gehen sollte. Die Seite wird aus Drupal 4.7.4 generiert und ich versuche mich daran ein eigenes Theme dafür zu erstellen.

Dabei bin ich trotz einiger Erfahrung mit XHTML und CSS auf zwei für mich bisweilen nicht zufriedenstellend lösbare Probleme gestossen. Hilfesuchend wende ich mich ans geballte Wissen der Apfeltalkerinnen und Apfeltalker. Gemäß W3C Validator ist alles gültiges XHTML 1.1 und CSS (2.1).

Also, der ganze Krempel steht natürlich online und ist unter der URL https://beta.maclemon.at/drupal/ erreichbar. (Ja, per SSL und das Zertifikat ist self-signed und paßt nicht zum Hostnamen. Ich weis, aber alles schreit ja lauthals "beta" und ist ergo nur zum Testen. Wer ganz sicher sein möchte, daß es sich um mein unpassendes Zertifikat handelt:
SHA1: 31 96 F3 28 6D 02 C7 C3 06 D1 B8 76 6A 5B AE 5C AE ED 8F C7
MD5: A7 DA E7 08 F9 2E 30 9A CE 45 64 1C BA 9C 94 ED)
Hier ist noch ein direkter Link zum Stylesheet.

Problem 1:
Im div #linkbar > #primary (der graue Balken in dem auf der Startseite "Home" steht.) möchte ich die Schrift vertikal zumindest ungefähr zentriert haben. So recht mag mir das bisweilen noch nicht gelingen.


Problem 2:
Das FORM Element des Suchfeldes soll ebenfalls in dieses #linkbar DIV hinein und zu allem Überfluß noch rechts außen (horizontal neben dem #primary) zu liegen kommen. Alle meine Versuche es dorthin zu zwingen sind jedoch gescheitert, da es immer nach unten (aus dem Balken raus) ausweicht, oder mit der Navigation links im Balken die Höhe des Balkens verdoppelt.


Bekannte Probleme zu denen ich momentan keine Lösung suche: (Damit nicht jemand unnötige Fleißaufgaben macht)
  • Die Punkterln ganz rechts oben erscheinen meines Wissens nach nur in Safari (also WebKit) und iCab korrekt, das macht aber nix, ist nur eine Spielerei.
  • Die Farben vom Favicon und der Seite sind nicht ident.
  • Internet Explorer
  • Der Link-Texthintergrund im #primary ist nicht korrekt, dies ist jedoch mit fehlerfreiem CSS nur schwierig zu bewerkstelligen.


Ich danke im Voraus herzlichst für alle Hilfestellungen.
Gruß Pepi
 

Hilarious

Gelbe Schleswiger Reinette
Registriert
10.08.05
Beiträge
1.759
Ich bastle momentan wieder mal an einer Webseite die irgendwann mal online gehen sollte. Die Seite wird aus Drupal 4.7.4 generiert und ich versuche mich daran ein eigenes Theme dafür zu erstellen.

Dabei bin ich trotz einiger Erfahrung mit XHTML und CSS auf zwei für mich bisweilen nicht zufriedenstellend lösbare Probleme gestossen. Hilfesuchend wende ich mich ans geballte Wissen der Apfeltalkerinnen und Apfeltalker. Gemäß W3C Validator ist alles gültiges XHTML 1.1 und CSS (2.1).

Also, der ganze Krempel steht natürlich online und ist unter der URL https://beta.maclemon.at/drupal/ erreichbar. (Ja, per SSL und das Zertifikat ist self-signed und paßt nicht zum Hostnamen. Ich weis, aber alles schreit ja lauthals "beta" und ist ergo nur zum Testen. Wer ganz sicher sein möchte, daß es sich um mein unpassendes Zertifikat handelt:
SHA1: 31 96 F3 28 6D 02 C7 C3 06 D1 B8 76 6A 5B AE 5C AE ED 8F C7
MD5: A7 DA E7 08 F9 2E 30 9A CE 45 64 1C BA 9C 94 ED)
Hier ist noch ein direkter Link zum Stylesheet.

Problem 1:
Im div #linkbar > #primary (der graue Balken in dem auf der Startseite "Home" steht.) möchte ich die Schrift vertikal zumindest ungefähr zentriert haben. So recht mag mir das bisweilen noch nicht gelingen.


Problem 2:
Das FORM Element des Suchfeldes soll ebenfalls in dieses #linkbar DIV hinein und zu allem Überfluß noch rechts außen (horizontal neben dem #primary) zu liegen kommen. Alle meine Versuche es dorthin zu zwingen sind jedoch gescheitert, da es immer nach unten (aus dem Balken raus) ausweicht, oder mit der Navigation links im Balken die Höhe des Balkens verdoppelt.


Bekannte Probleme zu denen ich momentan keine Lösung suche: (Damit nicht jemand unnötige Fleißaufgaben macht)
  • Die Punkterln ganz rechts oben erscheinen meines Wissens nach nur in Safari (also WebKit) und iCab korrekt, das macht aber nix, ist nur eine Spielerei.
  • Die Farben vom Favicon und der Seite sind nicht ident.
  • Internet Explorer
  • Der Link-Texthintergrund im #primary ist nicht korrekt, dies ist jedoch mit fehlerfreiem CSS nur schwierig zu bewerkstelligen.


Ich danke im Voraus herzlichst für alle Hilfestellungen.
Gruß Pepi

Hi Pepi,

(1)
Du kannst der Selektion #primary a:link, #primary a:visited einen Innenrand zuweisen, zum Beispiel padding: 0.4em;

(2)
Du müsstest dazu dem Formularelement Textfluss nach rechts zuweisen float: right. Je nach Zusammenhang müsste danach der Textfluss wieder zurückgesetzt werden (clear: both).

Bei den restlichen Fragen muss ich passen, denn Frau Hilarious will jetzt mit mir in den Baumarkt. :)
 

pepi

Cellini
Registriert
03.09.05
Beiträge
8.740
Hi Pepi,

(1)
Du kannst der Selektion #primary a:link, #primary a:visited einen Innenrand zuweisen, zum Beispiel padding: 0.4em;

(2)
Du müsstest dazu dem Formularelement Textfluss nach rechts zuweisen float: right. Je nach Zusammenhang müsste danach der Textfluss wieder zurückgesetzt werden (clear: both).[...]

Ad 1)
Mit einem Padding bekomme ich jedoch keine echte vertikale Ausrichtung, sondern schummel es nur ein bissl runter. Sobald ein System Fonts substituriert oder jemand die Schrift ein Stückerl vergrößert ist das alles wieder beim Teufel. Ich versuchs trotzdem, danke.

Ad 2)
Meinst Du wirklich ein float: right für den Text oder doch für das Block Element FORM selbst? Ich teste das mal.


Ich frage mich nur, warum du dich mit dieser "Landplage" Drupal rumärgerst, wenn es doch eine gewisse Anzahl an zumindest gleichwertigen oder teils besseren CMS und Portale gibt?

http://www.opensourcecms.com/
http://www.contentmanager.de/
http://www.digitalworkroom.com/
Das Problem ansich hat überhaupt nichts (oder nur sehr wenig) mit Drupal zu tun sondern ist ein Markup/CSS Problem mit Positionierung von Block-Elementen.

OpenSource CMS ist mir bekannte, ich informiere mich seit einigen Jahren dort, ebenso wie bei CMSmatrix und auch anderen Webseiten. Die von Dir genannten ContentenManager.de und DigitalWorkroom habe ich mir angesehen. Beide sagen mir aufgrund der Code Qualität nicht zu. Außerdem sind beide kommerziell entwickelte Produkte. Irgendwie sind sie mir nicht auf anhieb sympatisch. Mein persönliches Gefühl im Bauch ist hier leider ein diktatorischer Ausschlußgrund. Trotzdem danke für die Vorschläge.

Ich bin natürlich immer offen für alternative CMS Vorschläge. Ich würde mich auch über eine Begründung freuen warum Du Drupal als "Landplage" bezeichnest.

Ich habe mich momentan dazu entschlossen mich mit Drupal näher zu beschäftigen, da es mir von der Code Qualität (Standard Konformität) und der verfügbaren Dokumentation sehr sympatisch war. Auch Joomla und Wordpress konnten diese Ansprüche zur genüge füllen. Wobei Wordpress mir in diesem Fall für mein Vorhaben eher ungeeignet erschien, da es vom Konzept her sehr bloglastig ist. Ich verwende Wordpress jedoch auf einer andere Seite wo es wunderbar reinpaßt und funktioniert.
Joomla war mir nach einige Versuchen etwas zu komplex. Irgendwie bin ich trotz intensiver Literaturaneignung und persönlicher Auseinandersetzung damit nicht dorthingekommen wo ich hinwollte. Für andere Projekte würde ich Joomla jedoch durchaus in Betracht ziehen.
Gruß Pepi