mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 08.12.2016 08:59 Benutzername: Passwort: Auto-Login

Thema: [CSS] Inhalt innerhalb Layer vertikal ausrichten? vom 06.04.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Tipps & Tricks für Nonprint -> [CSS] Inhalt innerhalb Layer vertikal ausrichten?
Autor Nachricht
Sarky
Threadersteller

Dabei seit: 29.06.2002
Ort: Düsseldorf
Alter: 34
Geschlecht: Männlich
Verfasst Di 06.04.2004 17:12
Titel

[CSS] Inhalt innerhalb Layer vertikal ausrichten?

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich beschäftige mich zur Zeit ein wenig intensiver mit XHTML 1.0 und CSS 2 (tabellenloses Design) und stehe nun vor folgendem Problem: Ich habe einen DIV-Layer mit einer festen Breite und Höhe und will innerhalb dieses Layers einen Inhalt (Grafiken und/oder Text, beliebig) vertikal (nicht horizontal, das geht problemlos) ausrichten:

Code:

<style type=text/css>
#box
{
   width:320px;
   height:200px;
   
   border:1px solid #CFCFCF;   
   
   text-align: center;
   vertical-align: middle;
}
</style>

<div id=box>
Text
</div>


vertical-align wird von Mozilla und IE einfach ignoriert, obwohl es so in SelfHTML drin steht (nur dort wird es auf eine Tabelle angewandt).

Wie also mache ich sowas? Kann ja nicht sein, das es in HTML 4.X durch Tabellen ging und jetzt auf einmal nicht mehr...


Zuletzt bearbeitet von Sarky am Di 06.04.2004 17:13, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Imion

Dabei seit: 04.07.2003
Ort: Krefeld
Alter: 34
Geschlecht: Männlich
Verfasst Di 06.04.2004 17:27
Titel

Antworten mit Zitat Zum Seitenanfang

vertical-align funktioniert auch nur mit tabellen, zumindest ist mir nichts anderes bekannt. Aber es gibt ja auch noch ne menge befehle von css 2.0 die entweder nicht oder nur seltsam oder browserspezifisch funktionieren. Mach es am besten mit ner tabelle, es gibt für sowas keine andere lösung im moment, soweit ich weiß. *zwinker*

P.S.:
Das Tabellenlose Design hab ich aufgegeben, es funktioniert nicht wirklich gut. Meine Güte!


Zuletzt bearbeitet von Imion am Di 06.04.2004 17:28, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
burnout

Dabei seit: 31.01.2002
Ort: Osnabrücker Land
Alter: 36
Geschlecht: Männlich
Verfasst Di 06.04.2004 18:21
Titel

Antworten mit Zitat Zum Seitenanfang

hilft dir das evtl. weiter?
http://www.traum-projekt.com/html/css/align/index.php
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
dante

Dabei seit: 14.02.2004
Ort: NIC
Alter: 31
Geschlecht: Männlich
Verfasst Di 06.04.2004 19:18
Titel

Antworten mit Zitat Zum Seitenanfang

top margin vielleicht bei 50% ??
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Sarky
Threadersteller

Dabei seit: 29.06.2002
Ort: Düsseldorf
Alter: 34
Geschlecht: Männlich
Verfasst Mi 07.04.2004 17:35
Titel

Antworten mit Zitat Zum Seitenanfang

Imion hat geschrieben:
Mach es am besten mit ner tabelle, es gibt für sowas keine andere lösung im moment, soweit ich weiß. *zwinker*
Das Tabellenlose Design hab ich aufgegeben, es funktioniert nicht wirklich gut. Meine Güte!


Auf Tabellen will ich ja gerade unbedingt um jeden Preis verzichten *zwinker*
Also bisher funktioniert mein kompletter Seitenaufbau wunderbar mit tabellenlosem Design und ist zudem absolut frei von Darstellungsfehlern, sowohl im IE als auch Mozilla und Opera. Das von mir gepostete Problem ist das einzige was mich noch stört.

burnout hat geschrieben:
hilft dir das evtl. weiter?
http://www.traum-projekt.com/html/css/align/index.php


Vielen Dank für den Link, mit Text als Inhalt im DIV-Layer funktioniert es wunderbar, doch leider brauche ich unbedingt eine Grafik *Schnief*

Hat noch irgendwer von Euch Vorschläge? Das muß doch irgendwie gehen...
  View user's profile Private Nachricht senden
spammie

Dabei seit: 21.01.2011
Ort: -
Alter: -
Geschlecht: -
Verfasst Fr 21.01.2011 06:39
Titel

lösbar ;)

Antworten mit Zitat Zum Seitenanfang

sorry für das späte posting, aber da das thema immer noch ein problem ist hier eine mögliche lösung:
dem text folgende werte geben:

top: 50%;
margin: -(halbe zeilenhöhe) 0 0 0;
position: relative oder absolute;

damit sollte der text "richtig" platziert sein.
wenns nicht funktioniert liegts entweder an fehlenden werten (manchmal zb display: block;) am parentelement oder am fehlenden position property.

mfg
spammie


Zuletzt bearbeitet von spammie am Fr 21.01.2011 06:39, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 33
Geschlecht: Männlich
Verfasst Fr 21.01.2011 09:27
Titel

Antworten mit Zitat Zum Seitenanfang

Das Thema ist von 2004. Meinst Du nicht auch das es nicht mehr interessiert?
  View user's profile Private Nachricht senden
 
Ähnliche Themen [css] Layer horizontal und vertikal mittig ausrichten
CSS Container 100% Vertikal ausrichten
[css] list-style-image - vertikal ausrichten
CSS Container vertikal unten bündig ausrichten
CSS Div-Layer Breite an Inhalt anpassen
[Dreamweaver] Layer in einem anderen Layer unten ausrichten?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Tipps & Tricks für Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.