div centrieren - Paules-PC-Forum.de

Dj EKI · 06.02.2011, 11:16

Moin,

Was mach ich hier falsch?

Code:

<div align="center" class="page">
  <div align="center">Raum für den Inhalt von  class "page"</div>
</div>

ich will den div Centrieren. So das es in der Mitte der Page ist. Der Inhalt ist in der Mitte, aber der ganze div nicht.

ah, schon gelöst, es geht auch anders.

Code:

<style type="text/css">
.page {
	width: 101%;
	position: fixed;
}
</style>

und dann nur noch ne 2. div rein haun, mit einer mind. größe von 1024 und dann geht das schon.

mfg EKI

Jochen2011 · 06.02.2011, 11:57

das ist aber nicht zentriert

außerdem macht man das so, das sich das div automatisch
an die Browsergröße anpasst!

Dj EKI · 06.02.2011, 11:59

so schaut das jetzt aus.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
.page {
	width: 101%;
	position: fixed;
	padding-top: 15px;
	text-align: center;
}
.bodypage {
	z-index: auto;
	clip: rect(auto,auto,auto,auto);
	height: auto;
	width: 1024px;
	text-align: center;
	left: 0px;
	top: 0px;
	margin-right: auto;
	margin-left: auto;
}
</style>
</head>

<body>
<div class="page">
<div class="bodypage">
  <div>
    <div class="banner">Raum für den Inhalt von  class "banner"</div>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
  </div>
</div>
</div>
</body>
</html>

**Tunarus** · 06.02.2011, 12:03

Die Verschachtelung zweier DIVs ist schon korrekt aber dann eher so:

Der äußere Container:

.container{
position:fixed;
margin:0 auto;
width:100%;
}

Der innere DIV mit dem zentrierten Content:

.inhalt{
margin:0 auto;
width:1000px;
min-height:400px;
}

Die Zentrierung von DIVs wird mit margin:0 auto; vorgenommen

Gruß,
Tunarus

**Tunarus** · 06.02.2011, 12:09

...du solltest deinen Zeichensatz übrigens ändern in charset=iso-8859-1, damit auch Sonderzeichen korrekt dargestellt werden, sonst blüht dir das hier:

Gruß,
Tunarus

Dj EKI · 06.02.2011, 12:12

axo, aber da ich ja mit Dreamweaver arbeite, macht der das nicht irgendwie automatisch? das nicht plötzlich Fragezeichen entstehen? Im Entwurf schaut noch alles top aus.

Jochen2011 · 06.02.2011, 12:12

gib den Div`s mal eine Hintergrundfarbe
dann mach mal dein Browserfenster bischen kleiner
dann seh ich nur noch die Hälfte

**Tunarus** · 06.02.2011, 12:15

...jepp - Dreamweaver macht das automatisch... falsch. Du kannst in den Websiteeigenschaften festlegen, welchen Zeichensatz Dreamweaver verwenden soll. Standardmäßig ist hier - weil englischsprachiges Programm - utf-8 eingestellt. Für die korrekte Darstellung der deutschen Umlaute brauchst du aber den Zeichensatz iso-8859-1.

Besser ist natürlich generell die Verwendung des richtigen html-codes. Für das kleine "ü" also beispielsweise ü

Gruß,
Tunarus

**Tunarus** · 06.02.2011, 12:22

...kleiner Tipp noch:
Du kannst den ->W3C Validator<- verwenden, um deine Website auf Fehler zu überprüfen. Der Validator ist dann auch so freundlich und beschreibt dir exakt was für Fehler bestehen, wo die sich befinden und wie du sie abstellst.

Gruß,
Tunarus

Jochen2011 · 06.02.2011, 12:29

Zitat:

Zitat von Tunarus

...kleiner Tipp noch:
Du kannst den ->W3C Validator<- verwenden, um deine Website auf Fehler zu überprüfen. Der Validator ist dann auch so freundlich und beschreibt dir exakt was für Fehler bestehen, wo die sich befinden und wie du sie abstellst.

Gruß,
Tunarus

das kann man auch schon direkt mit Dreamweaver machen!

"weil englischsprachiges Programm"

Dj EKI · 06.02.2011, 12:30

jochy: Ich hätte gerne, das da eine standardgröße bleibt. Und das hat sehr gut geklappt, das von Tunarus.

Tunarus, danke, aber leider hab ich die iso nicht in der Liste vorhanden. Der UTF-8 funktioniert aber komischerweise in meiner Browser vorschau. Und im Quelltext hatte sich auch nix geändert.

Es ist aber alels komplett auf deutsch, das programm

Aber was mir noch wichtig wäre. Wenn ich den browserfenster kleiner mache, habe ich kein Scrollbalken.

Jochen2011 · 06.02.2011, 12:33

Zitat:

Zitat von Dj EKI

jochy: Ich hätte gerne, das da eine standardgröße bleibt. Und das hat sehr gut geklappt, das von Tunarus.

Tunarus, danke, aber leider hab ich die iso nicht in der Liste vorhanden. Der UTF-8 funktioniert aber komischerweise in meiner Browser vorschau. Und im Quelltext hatte sich auch nix geändert.

Aber was mir noch wichtig wäre. Wenn ich den browserfenster kleiner mache, habe ich kein Scrollbalken.

genau das meinte ich!
aber das bekommste jetzt aber alleine hin.

war auch nur ein Beispiel von mir

Dj EKI · 06.02.2011, 12:34

und auf was müsste ich achten, damit genau den scrollbalken bekomme?

**Tunarus** · 06.02.2011, 12:47

...ok, ok, ich hab´s falsch ausgedrückt.

Der utf-8 ist bei den meisten Websiteeditoren der Standardzeichensatz weil eben international (...nicht englischsprachig

). Dummerweise weist der aber bei den deutschsprachigen Browsern - je nach Einstellung - häufig die Umlaute falsch aus, siehe Grafik oben für meinen Feuerfuchs. Mit dem iso-8859-1 funktioniert´s dagegen.

Der Zeichensatz wird möglicherweise anders/ähnlich bezeichnet, z.B. "US/Westeuropäisch (ISO)" oder so. Ansonsten einfach im Template einmal manuell erfassen und dann immer das Template benutzen.

Die Diskussion über Scrollbalken ist eine Never-Ending-Story bei Webmastern. Zentrierter Inhalt hüppt beim erscheinenden Rollbalken um einige Pixel hin und her - ->hier schön zu sehen<- (allerdings nicht im IE, der generell den Rollbalken reserviert). Das ist allerdings die "reine Lehre", will sagen valider Code vom W3C. Das künstliche dauerhafte Einblenden von Rollbalken, z.B. durch ein langes min-height, um diesen Effekt zu unterbinden, gilt als unfein.

Ich persönlich lasse den Rollbalken links liegen, z.B. bei diesen zentrierten Seiten, die ich gebaut habe:
In HTML 4.01:
->Meine Stöberbox<-

In XHTML 1.0
->Grundschule Kuhstraße<-
->HNO Praxis<-
->Pysiopraxis<-
...und noch ein paar andere.

Der Rollbalken erscheint bei mir nur, wenn die Seitenlänge das auch erfordert.

Gruß,
Tunarus

Thomas2010 · 06.02.2011, 12:51

Hi,

in Dreamweaver stellst Du es in den Voreinstellungen ein (Westeuropäisch):

Sind hier die richtigen Einstellungen vorausgesetzt, codiert Dreamweaver die Umlaute automatisch.genommen codiert

06.02.2011, 11:16	#1 (Direktlink)
Dj EKI Forenmaskottchen Registriert seit: 04.10.2004 Beiträge: 706	div centrieren Moin, Was mach ich hier falsch? Code: <div align="center" class="page"> <div align="center">Raum für den Inhalt von class "page"</div> </div> ich will den div Centrieren. So das es in der Mitte der Page ist. Der Inhalt ist in der Mitte, aber der ganze div nicht. ah, schon gelöst, es geht auch anders. Code: <style type="text/css"> .page { width: 101%; position: fixed; } </style> und dann nur noch ne 2. div rein haun, mit einer mind. größe von 1024 und dann geht das schon. mfg EKI __________________ Bilder sind Leider nicht Erlaubt -.- schade... obwohl ich sowas sehr gerne gestalte und Präsentiere ... Geändert von Dj EKI (06.02.2011 um 11:22 Uhr)

06.02.2011, 12:03	#4 (Direktlink)
Tunarus Super-Moderator Registriert seit: 19.02.2008 Ort: Velbert Beiträge: 1.726	Die Verschachtelung zweier DIVs ist schon korrekt aber dann eher so: Der äußere Container: .container{ position:fixed; margin:0 auto; width:100%; } Der innere DIV mit dem zentrierten Content: .inhalt{ margin:0 auto; width:1000px; min-height:400px; } Die Zentrierung von DIVs wird mit margin:0 auto; vorgenommen Gruß, Tunarus __________________ http://www.stoeberbox.de

06.02.2011, 12:09	#5 (Direktlink)
Tunarus Super-Moderator Registriert seit: 19.02.2008 Ort: Velbert Beiträge: 1.726	...du solltest deinen Zeichensatz übrigens ändern in charset=iso-8859-1, damit auch Sonderzeichen korrekt dargestellt werden, sonst blüht dir das hier: Gruß, Tunarus __________________ http://www.stoeberbox.de

06.02.2011, 12:12	#6 (Direktlink)
Dj EKI Forenmaskottchen Registriert seit: 04.10.2004 Beiträge: 706	axo, aber da ich ja mit Dreamweaver arbeite, macht der das nicht irgendwie automatisch? das nicht plötzlich Fragezeichen entstehen? Im Entwurf schaut noch alles top aus. __________________ Bilder sind Leider nicht Erlaubt -.- schade... obwohl ich sowas sehr gerne gestalte und Präsentiere ...

06.02.2011, 12:15	#8 (Direktlink)
Tunarus Super-Moderator Registriert seit: 19.02.2008 Ort: Velbert Beiträge: 1.726	...jepp - Dreamweaver macht das automatisch... falsch. Du kannst in den Websiteeigenschaften festlegen, welchen Zeichensatz Dreamweaver verwenden soll. Standardmäßig ist hier - weil englischsprachiges Programm - utf-8 eingestellt. Für die korrekte Darstellung der deutschen Umlaute brauchst du aber den Zeichensatz iso-8859-1. Besser ist natürlich generell die Verwendung des richtigen html-codes. Für das kleine "ü" also beispielsweise ü Gruß, Tunarus __________________ http://www.stoeberbox.de

06.02.2011, 11:57	#2 (Direktlink)
Jochen2011 Dauergast Registriert seit: 28.11.2008 Beiträge: 1.197	das ist aber nicht zentriert außerdem macht man das so, das sich das div automatisch an die Browsergröße anpasst!

06.02.2011, 12:12	#7 (Direktlink)
Jochen2011 Dauergast Registriert seit: 28.11.2008 Beiträge: 1.197	gib den Div`s mal eine Hintergrundfarbe dann mach mal dein Browserfenster bischen kleiner dann seh ich nur noch die Hälfte

06.02.2011, 12:22	#9 (Direktlink)
Tunarus Super-Moderator Registriert seit: 19.02.2008 Ort: Velbert Beiträge: 1.726	...kleiner Tipp noch: Du kannst den ->W3C Validator<- verwenden, um deine Website auf Fehler zu überprüfen. Der Validator ist dann auch so freundlich und beschreibt dir exakt was für Fehler bestehen, wo die sich befinden und wie du sie abstellst. Gruß, Tunarus __________________ http://www.stoeberbox.de

06.02.2011, 12:30	#11 (Direktlink)
Dj EKI Forenmaskottchen Registriert seit: 04.10.2004 Beiträge: 706	jochy: Ich hätte gerne, das da eine standardgröße bleibt. Und das hat sehr gut geklappt, das von Tunarus. Tunarus, danke, aber leider hab ich die iso nicht in der Liste vorhanden. Der UTF-8 funktioniert aber komischerweise in meiner Browser vorschau. Und im Quelltext hatte sich auch nix geändert. Es ist aber alels komplett auf deutsch, das programm Aber was mir noch wichtig wäre. Wenn ich den browserfenster kleiner mache, habe ich kein Scrollbalken. __________________ Bilder sind Leider nicht Erlaubt -.- schade... obwohl ich sowas sehr gerne gestalte und Präsentiere ...

06.02.2011, 12:34	#13 (Direktlink)
Dj EKI Forenmaskottchen Registriert seit: 04.10.2004 Beiträge: 706	und auf was müsste ich achten, damit genau den scrollbalken bekomme? __________________ Bilder sind Leider nicht Erlaubt -.- schade... obwohl ich sowas sehr gerne gestalte und Präsentiere ...

06.02.2011, 12:47	#14 (Direktlink)
Tunarus Super-Moderator Registriert seit: 19.02.2008 Ort: Velbert Beiträge: 1.726	...ok, ok, ich hab´s falsch ausgedrückt. Der utf-8 ist bei den meisten Websiteeditoren der Standardzeichensatz weil eben international (...nicht englischsprachig ). Dummerweise weist der aber bei den deutschsprachigen Browsern - je nach Einstellung - häufig die Umlaute falsch aus, siehe Grafik oben für meinen Feuerfuchs. Mit dem iso-8859-1 funktioniert´s dagegen. Der Zeichensatz wird möglicherweise anders/ähnlich bezeichnet, z.B. "US/Westeuropäisch (ISO)" oder so. Ansonsten einfach im Template einmal manuell erfassen und dann immer das Template benutzen. Die Diskussion über Scrollbalken ist eine Never-Ending-Story bei Webmastern. Zentrierter Inhalt hüppt beim erscheinenden Rollbalken um einige Pixel hin und her - ->hier schön zu sehen<- (allerdings nicht im IE, der generell den Rollbalken reserviert). Das ist allerdings die "reine Lehre", will sagen valider Code vom W3C. Das künstliche dauerhafte Einblenden von Rollbalken, z.B. durch ein langes min-height, um diesen Effekt zu unterbinden, gilt als unfein. Ich persönlich lasse den Rollbalken links liegen, z.B. bei diesen zentrierten Seiten, die ich gebaut habe: In HTML 4.01: ->Meine Stöberbox<- In XHTML 1.0 ->Grundschule Kuhstraße<- ->HNO Praxis<- ->Pysiopraxis<- ...und noch ein paar andere. Der Rollbalken erscheint bei mir nur, wenn die Seitenlänge das auch erfordert. Gruß, Tunarus __________________ http://www.stoeberbox.de

06.02.2011, 12:51	#15 (Direktlink)
Thomas2010 Dauergast Registriert seit: 10.10.2010 Ort: 50° 57′ N, 10° 43′ O Alter: 52 Beiträge: 1.857	Hi, in Dreamweaver stellst Du es in den Voreinstellungen ein (Westeuropäisch): Sind hier die richtigen Einstellungen vorausgesetzt, codiert Dreamweaver die Umlaute automatisch.genommen codiert __________________ Jetzt -- ist schon vorbei. © Walter Ludin

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Text centrieren	Rolf	Homepagegestaltung	19	09.03.2008 19:56