• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HTML Seite zentrieren

Status
Für weitere Antworten geschlossen.
M

MDNoob

Neues Mitglied
Hallo Leute!

Bin ein ziemlicher Anfänger auf dem Gebiet HTML. Ich hab mir eine Seite erstellt die schon ziemlich gut aussieht, wäre sie doch nur zentriert! Wenn man sie mit dem DW zentriert funkt das für Mozilla nicht! Hab auch schon einen Haufen Sachen ausprobiert aber nichts will funktionieren! :cry: :evil: :cry:

Ich wäre euch echt dankbar wenn mir jemand einen code speziell für meine Seite sagen könnte der in allen Browsern funkt.



schauts euch eben mal an...
 
Zuletzt bearbeitet:
HTML: 
<body>
<div align="center">
<!-- Inhalt -->
</div>
</body>

würds so machen, ob das die beste Lösung ist, weiss ich nicht.

mfg
 
Würd das so machen:
HTML: 
 <body> <div style="margin-left: auto; margin-right:auto; width: 700px"> <!-- --> </div> </body
CSS natürlich auslagern und Breite nach belieben ändern.

Edit: jo margin: 0 auto; geht auch, wobei ich zugeben muss, dass du bei keiner bestimmten Breite text-align: center; nehmen musst.
 
Zuletzt bearbeitet:
Hi,

Edit: jo margin: 0 auto; geht auch
Zum Vergrößern anklicken....

Geht nicht nur ist auch das Standardverfahren.

dass du bei keiner bestimmten Breite text-align: center; nehmen musst.
Zum Vergrößern anklicken....

text-align ist, wie der Name schon sagt, ausschließlich für die Textausrichtung innerhalb eines Containers zuständig.

align:center ist für Tabellen und nicht für divs

@test.mdtraining.at

Auf der HP sind divs und Tabellen gemischt. das ist eher kontraproduktiv.
Links gehören z.B. in eine ungeordnete Liste und nicht in ein <table> oder <p>.
Außerdem sollten code und Layout strikt getrennt sein, d.h. styles gehören in eine extra css.Datei.

Dein doctype ist XHTML, aber du codest nicht so, d.h.
Code: 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

das ist verboten, bei XHTML sind alleinstehende Elemente ohne Abschluß nicht erlaubt.

So
Code: 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

muß es formuliert werden.
 
koslowski schrieb:
Hi,



Geht nicht nur ist auch das Standardverfahren.



text-align ist, wie der Name schon sagt, ausschließlich für die Textausrichtung innerhalb eines Containers zuständig.

align:center ist für Tabellen und nicht für divs

@test.mdtraining.at

Auf der HP sind divs und Tabellen gemischt. das ist eher kontraproduktiv.
Links gehören z.B. in eine ungeordnete Liste und nicht in ein <table> oder <p>.
Außerdem sollten code und Layout strikt getrennt sein, d.h. styles gehören in eine extra css.Datei.

Dein doctype ist XHTML, aber du codest nicht so, d.h.
Code: 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

das ist verboten, bei XHTML sind alleinstehende Elemente ohne Abschluß nicht erlaubt.

So
Code: 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

muß es formuliert werden.
Zum Vergrößern anklicken....



Danke erstmal für eure antworten!

Gibt es die Möglichkeit die Seite zu zentrieren ohne dass ich die table und so raus nehme oder kann das so garnicht funktionieren?
Falls nein, wie mache ich das dann mit der untergeordneten liste?

Den code hab ich doch genau so drin?!

Code: 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Könnt ihr mir vielleicht das oben genannte Standardverfahren nochmal als kompletten code schicken?

ich weis ich bin anstrengend :oops:
 
Hi,

ich weis ich bin anstrengend
Zum Vergrößern anklicken....

macht nix, das warn wir auch mal wie wir angefangen haben.8)

Könnt ihr mir vielleicht das oben genannte Standardverfahren nochmal als kompletten code schicken?
Zum Vergrößern anklicken....

Standardverfahren zum zentrieren:

du machst dir einen <div> wo alles andere drinhockt (divs, Tabellen, etc.)
wird meistens #wrapper genannt.

Das sieht dann so aus:

Code: 
<body>
  <div id="wrapper">
     <div id="navi"></div>
     <div id="content"></div>
   </div> <!----------Ende #wrapper----------->
 </body>

und #wrapper zentrierst du dann mit:
Code: 
#wrapper  {  margin:0 auto;  }

Den code hab ich doch genau so drin?!

Code:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
jetzt ja.
 
Falls du noch am start bist... schau doch bitte nochmal auf test.mdtraining.at was ich da fabriziert hab.

muss ich die gesamte page (ohne /head) da rein stellen wo <----ende wrapper----> steht oder ist das richtig so wie ich es gerade hab

bei der page verändert sich garnichts wenn dich den code rein mach :???:
 
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=iso-8859-1" />
<title>MD Fitness Solutions</title>
</head>

<body>
<div id="wrapper">
    <div style="height:74px;">
        <div style="width:214px; height:74px; float:left; background-image:url(Bilder/MD_Logo.jpg);">
        </div>
.....
.....
....
<div style="background-image:url(Bilder/Footer_komplett.PNG); width:776px; height:175px;">
        </div>
    </div>
</div>
</div>

</div><!-- ENDE VON WRAPPER -->
</body>
</html>
Das CSS File :
Code: 
#wrapper  {  margin:0 auto; width:776px;  }
so müsst gehen denke ich.

oder direkt wenn du kein exta CSS File magst :
statt
HTML: 
 <div id="wrapper">
dann
HTML: 
 <div style="margin:0 auto; width:776px;">
mfg

EDIT : warum wird der Code manchmal umgebrochen und manchmal nicht ??
EDIT2 : hab jetzt statt den HTML tags die CODE tags genommen und jetzt wird der Code ugebrochen ^^
 
Zuletzt bearbeitet:
Achtung,

der IE 6 hat Probleme mit "margin: 0 auto;"

Hier hilft es oft nur, den übergeordneten Bereich mit "text-align: center" auszustatten, damit der darauffolgende Bereich zentriert wird.
 
Hi,

Achtung,
der IE 6 hat Probleme mit "margin: 0 auto;"
Hier hilft es oft nur, den übergeordneten Bereich mit "text-align: center" auszustatten, damit der darauffolgende Bereich zentriert wird.
Zum Vergrößern anklicken....

[Häh?]Wie kommste denn darauf[/Häh?]

Auf meinen Webseiten hatte ich noch nie Probleme damit.

Was meinste warum text-align text-align heißt?

Na, klingelts?:mrgreen:
 
ich habs früher mit
<div align="center">
zerntriert, das hat auch immer funtkioniert - ist aber anscheinend nicht für den div tag gedacht.
 
@koslowski

Das hängt vom Code ab. Wenn dieser Standartkonform ist, gibt es keine probleme. Sobald man aber den Doctype, bzw den <xml-prolog angibt, schaltet der IE6 in den Quirks-mode, und kann mit "margin: 0 auto;" nichts mehr anfangen. Dann lässt sich die nächste Box, Tabelle etc nur über "text-align: center" zentrieren. Auch wenn es "text-align" heißt. Der IE kappierts dann nicht anders.

Ich häng nochmal einen Link zu selfhtml mit dran: http://www.html.de/html-und-xhtml/16665-html-seite-zentrieren-2.html
 
Zuletzt bearbeitet:
Hi,

ich habs früher mit
<div align="center">
zerntriert, das hat auch immer funtkioniert - ist aber anscheinend nicht für den div tag gedacht.
Zum Vergrößern anklicken....

Stimmt, hats auch.

Die Semantik der Eigenschaft text-align geht ja schon aus dem Wort hervor, sonst ständ da ja seitenzentrier-align.:mrgreen:

Hi,

Das hängt vom Code ab. Wenn dieser Standartkonform ist, gibt es keine probleme. Sobald man aber den Doctype, bzw den <xml-prolog angibt, schaltet der IE6 in den Quirks-mode, und kann mit "margin: 0 auto;" nichts mehr anfangen. Dann lässt sich die nächste Box, Tabelle etc nur über "text-align: center" zentrieren. Auch wenn es "text-align" heißt. Der IE kappierts dann nicht anders.
Zum Vergrößern anklicken....

Warum sollte ich irgendeinen Browser in den Quirksmodus schicken, son' Tinnef fang ich gar nicht erst an.

Der IE6 versteht im Quirksmodus nicht nur margin:0 auto; nicht mehr er kapiert das komplette Boxmodell nicht mehr.
Dann hast du i.d.R. noch eine Menge mehr Probleme mit der Darstellung im IE6.

Persönlich lege ich Wert darauf das die Webseiten die ich code alle Browser im Standardmodus lassen.

Das kann man ja auch rappzapp überprüfen.
 
Zuletzt bearbeitet von einem Moderator:
Hey Leute,

es ist wirklich unglaublich! NICHTS scheint zu funktionieren. Ich habe es genau so eingesetzt wie beschrieben. Das einzigste was sich verändert hat war, dass mein logo sich verdoppelt hat und in der mitte nochmal zu sehen war. Ich bin langsam echt am Rande der verzweiflung!

Wenn ihr noch irgend welche Vorschläge habt wäre ich euch mehr als dankbar!
 
also wenn ich auf deine Seite gehe ( MD Fitness Solutions ) und mir denn Quellcode anschaue hat sich da gar nichts verändert.
Hast du die Änderungen local gemacht ?
Wenn ja, lads doch bitte hoch, dass ma sich das anschauen kann.
thx :D

mfg

EDIT :
Kein Problem - gerne ;)
Problem soweit gelöst.
 
Zuletzt bearbeitet:
Ein Fettes Dankeschön an euch alle! Ich hatte die Hoffnung schon aufgegeben als mich meine Seite plötzlich aus der Bildschirmmitte anlachte! :mrgreen::mrgreen::mrgreen::mrgreen::mrgreen:
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben