mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Sa 20.04.2024 00:53 Benutzername: Passwort: Auto-Login

Thema: Content mittels CSS zentriert anzeigen vom 10.07.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Content mittels CSS zentriert anzeigen
Seite: 1, 2, 3, 4  Weiter
Autor Nachricht
Xaven
Threadersteller

Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: Männlich
Verfasst Sa 10.07.2004 23:19
Titel

Content mittels CSS zentriert anzeigen

 Antworten mit Zitat Zum Seitenanfang
Tach!

Ich habe eben mal den PAGE Workshop für reines CSS-Sitedesign durchgemacht und probiere den Spass jetzt an etwas eigenem aus.

Das hier möchte ich in reinem CSS nachbauen: www.phasedrei.com - ist ja relativ einfach gemacht.
Nun habe ich in meinem CSS-Dok. folgende Angaben drin:
Code:
div#content {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   height: 300px;
   width: 450px;
}


Wie kann ich diesem div#content nun sagen, dass er auf der Seite horizontal und vertikal zentriert erscheinen soll?

Gruss Mario
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Waschbequen
Account gelöscht


Ort: -

Verfasst So 11.07.2004 00:57
Titel

Antworten mit Zitat Zum Seitenanfang
Suche...
 
Anzeige
Anzeige
Xaven
Threadersteller

Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: Männlich
Verfasst So 11.07.2004 13:15
Titel

Antworten mit Zitat Zum Seitenanfang
Waschbequen hat geschrieben:
Suche...


Dankeschön - funktioniert bis dahin wunderbar und sieht so aus:
Code:
div#content {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   background-image: url(img/platzhalter.gif);
   height: 300px;
   width: 450px;
   position:absolute;
   left:50%;
   top:50%;
   height:300px;
   width:450px;
   margin-left:-225px;
   margin-top:-150px;
   padding: 40px;
}


Wie ihr seht habe ich nun noch ein padding eingerichtet um den Text besser zu positionieren. Dieses Padding zerreisst mir jetzt allerdings wieder alles. Was mach ich falsch?
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Xaven
Threadersteller

Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 12.07.2004 14:23
Titel

Antworten mit Zitat Zum Seitenanfang
*push*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 12.07.2004 14:25
Titel

Antworten mit Zitat Zum Seitenanfang
das padding wird ur größe hinuaddiert.
du musst dann die 40px vom margin wieder abiehen.

//edit:
lad mal rauf, ich schau mal drüber.

Zuletzt bearbeitet von beeviZ am Mo 12.07.2004 14:26, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Xaven
Threadersteller

Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 12.07.2004 14:53
Titel

Antworten mit Zitat Zum Seitenanfang
beeviZ hat geschrieben:
das padding wird ur größe hinuaddiert.
du musst dann die 40px vom margin wieder abiehen.

//edit:
lad mal rauf, ich schau mal drüber.


Hab die 40px jetzt den den margins abgezogen aber irgendwie ist die Seite dann nicht wirklich zentriert > http://www.phasedrei.com/0.5/index-css.htm

Außerdem wird jetzt das ganze DIV-Dingens wieder grösser, was mir die Grafik im Hintergrund zerreist (bedingt durch das padding).

Zuletzt bearbeitet von Xaven am Mo 12.07.2004 14:54, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 12.07.2004 15:06
Titel

Antworten mit Zitat Zum Seitenanfang
css so:

div#content {font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
background: url(platzhalter.gif) no-repeat top center;
height: 300px;
width: 450px;
position:absolute;
left:50%;
top:50%;
height:300px;
width:450px;
margin-left:-265px;
margin-top:-150px;
padding: 40px;
}


dann sollte es gehen Lächel

Zuletzt bearbeitet von beeviZ am Mo 12.07.2004 15:09, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Xaven
Threadersteller

Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 12.07.2004 15:13
Titel

Antworten mit Zitat Zum Seitenanfang
beeviZ hat geschrieben:
css so:

div#content {font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
background: url(platzhalter.gif) no-repeat top center;
height: 300px;
width: 450px;
position:absolute;
left:50%;
top:50%;
height:300px;
width:450px;
margin-left:-265px;
margin-top:-150px;
padding: 40px;
}


dann sollte es gehen Lächel


Negativ. Sollte doch eigentlich die einfachste Übung sein sowas darzustellen oder? Aber mit reinem CSS sind so horizontal und vertikal zentrierte Sachen wohl nicht so einfach.

*hilfe*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen layout mit layern zentriert anzeigen
Scroll-Bar Zentriert anzeigen lassen.
Wie kann man ein Frameset zentriert anzeigen lassen?
button, content anzeigen, aber wie?
Content Editing, statt Content Management
Objekt zentriert
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2, 3, 4  Weiter
MGi Foren-Übersicht -> Allgemeines - 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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB