Anzeige

Webseite zentrieren?

Webseite zentrieren? | PSD-Tutorials.de

Erstellt von AlphaGen, 10.09.2008.

  1. AlphaGen

    AlphaGen Nicht mehr ganz neu hier

    Dabei seit:
    14.05.2008
    Beiträge:
    169
    Geschlecht:
    männlich
    Webseite zentrieren?
    Folgendes Problem: Ich habe eine Webseite, die 800x600 px groß ist. Die Seite möchte ich nun sowohl Horizontal als auch Vertikal zentrieren. Das soll selbstverständlich für jede Auflösung funktionieren.


    HTML:
    1.  
    2. <body style="margin:0px; padding:0px; background:#FFFFFF; vertical-align:middle; height:100%; width:100%;">
    3. <table style="width:800px; height:600px; vertical-align:top; margin:0 auto; text-align:center; border-width:1px; border-style:solid; border-color:#770000">
    4.     <tr>
    5.         <td style="width:800px; height:214px; vertical-align:top; text-align:center;"><img src="Bilder/banner.jpg" />
    6. </td>
    7. </tr>
    8.  
    9. <tr>
    10. <td style="width:800px; height:214px; vertical-align:top; text-align:center;">Das ist ein Test <!-- Hier stehen die Inhalte der Seite --></td>
    11.  </tr>
    12. </body>
     
    #1      
  2. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Hast Du schon mal die Suchefunktion oder eine Suchmaschine bemüht?
     
    #2      
  3. AlphaGen

    AlphaGen Nicht mehr ganz neu hier

    Dabei seit:
    14.05.2008
    Beiträge:
    169
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    google.de

    Webseite vertikal zentrieren: margin-top: 0 auto; margin-bottom: 0 auto;
    Das soll in den style der Tabelle. Aber funktioniert nicht.
     
    #3      
  4. Karsten_bln

    Karsten_bln Nicht mehr ganz neu hier

    Dabei seit:
    02.06.2006
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Berlin
    Software:
    Affinity Photo Affinity Designer, Atom
    Kameratyp:
    Canon Eos 300D
    Webseite zentrieren?
    #4      
  5. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Pack um die Tabelle einen Wrapper, also div mit den CSS Angaben, die du bei google gefunden hast.
     
    #5      
  6. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Dank google:

    HTML:
    1.  
    2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    3. <title>Test</title>
    4. <style type="text/css">
    5. body { background-color: #000000;
    6. margin: 0;
    7. padding: 0;}
    8. .content{position: absolute;
    9. background-color: #ffffff;
    10. width:800px;
    11. height: 600px;
    12. left: 50%;
    13. top: 50%;
    14. margin-left: -400px;
    15. margin-top: -300px;}
    16. </head>
    17. <div class="content">
    18. </div>
    19. </body>
    20. </html>
    21.  
     
    #6      
  7. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Wo hast du den Müll denn gefunden???

    HTML:
    1.  
    2. #wrapper {
    3. margin: 0px auto;
    4. }
    5.  
    6. <div id="wrapper">
    7. weiterer Quelltext...
    8. </div>
    9.  
    ...und fertig ist die Suppe.
     
    #7      
  8. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    vertikal und horizontal und nach Möglichkeit in allen Browsern gleich. Ob Müll interessiert mich nicht, ich verbaue es nicht ;)
     
    #8      
  9. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Horizontal zentrieren ist nicht möglich.
     
    #9      
  10. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Dann probier den "Müll". Bei mir klappt es im Opera, FF, IE, Safari und NS
     
    #10      
  11. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Und wie sieht es aus, wenn die Höhe der Website variabel ist??
     
    #11      
  12. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Guck doch :p
     
    #12      
  13. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Das geht nämlich nicht.

    Ich habe aus dem Quelltext die Höhenangabe entfernt und schon wird das nicht mehr horizontal zentriert angezeigt, nur vertikal.
     
    #13      
  14. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Dann hat einer von uns beiden etwas falsch verstanden. Aufgabe laut erstem Posting und Quelltext: Tabelle, 800px breit, 600px hoch, horizontal zentrieren, vertikal zentrieren.
     
    #14      
  15. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Vertikal ist möglich, horizontal nicht. Das versuche ich doch die ganze Zeit dir zu sagen.

    Besser gesagt: Bei einer fixen Höhe ist es möglich, bei einer variablen nicht. Da variable Höhen aber besser bezüglich der Barrierefreiheit sind, empfehle ich dies grundsätzlich und versuche fixe Höhen zu vermeiden.
     
    #15      
  16. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Da ist meine Frau ja noch harmlos :uhm:
     
    #16      
  17. stb_87

    stb_87 Web-Sheriff - ohne Bild

    Dabei seit:
    13.05.2007
    Beiträge:
    1.895
    Geschlecht:
    männlich
    Software:
    dies & das
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Jeder hat seine eigene Meinung und das ist auch ganz gut so ;)
     
    #17      
  18. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Vielleicht liegt es hier an den Begrifflichkeiten:
    http://de.wikipedia.org/wiki/Horizontal

    horizontal lassen sich inhalte (Container) einfach durch Breitenangabe und margin: auto; ausrichten.
     
    #18      
  19. netbandit

    netbandit Aktives Mitglied

    12
    Dabei seit:
    18.05.2008
    Beiträge:
    1.145
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Daran liegt es nicht. Er fragte mich zwischendurch wie es aussieht, wenn die Höhe der Webseite variabel ist (war ja eigentlich gar nicht vom Threadersteller gefragt). Webseite habe ich überlesen, bzw. ich bin von der Fenstergröße ausgegangen. Also hat er doch noch "irgendwie/irgendwann" recht gehabt ;)
     
    #19      
  20. AlphaGen

    AlphaGen Nicht mehr ganz neu hier

    Dabei seit:
    14.05.2008
    Beiträge:
    169
    Geschlecht:
    männlich
    Webseite zentrieren?
    AW: Webseite zentrieren?

    Horizontal = parallel zum Horizont.
    Vertikal = (in diesem fall!!!) Senkrecht zum horizont.

    Horizontal kann man ALLES ganz leicht zentrieren.
    Aber Vertikal ist es nicht sooo einfach.

    Ich probier mal eure Sachen aus. :)
    Danke

    Soo... Der "Müll" funktioniert. DAs ist schonmal sehr gut. Mehr brauche ich im PRINZIP nicht. Aber aus Interesse möchte ich wissen, ob es eine Möglichkeit gibt, dynamische Seiten ebenfalls horizontal und vertikal zu zentrieren.
     
    Zuletzt bearbeitet: 11.09.2008
    #20      
x
×
×