Ergebnis 1 bis 10 von 10

Thema: Website zentrieren mit CSS

  1. #1
    Azubi(ne)
    Registriert seit
    22.12.2007
    Beiträge
    51
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Website zentrieren mit CSS

    Hallo,
    mein Problem ist, dass ich mit CSS versuche die Website zu zentrieren, doch daran scheitere ich im Moment. Sie wird nämlich nicht korrekt zentriert (linker Abstand zum Rand ist kleiner als der Abstand von Rechts).

    So ist meine Seite grob aufgebaut:
    Code:
    <body>
    <main>
    <menu></menu>
    <content>
    </content>
    </main>
    </body>
    Soo, und ich habe versucht folgendes mit CSS zu machen:
    Code:
    main &#123;
    margin-left&#58; 10%;
    margin-right&#58; 10%;
    width&#58; 80%;
    &#125;
    Dies hat auch funktioniert, doch wenn ich einen Rahmen (border) um "main" einfüge mit z.B. 8px Breite, dann ist es nicht mehr richtig zentriert.

    Kann mir da jemand helfen?
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    mach ne feste breite für main und gib dem ding nen margin: 0 auto;
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Zwei mal 10% links und rechts plus 80% Mitte ergibt 100%. Der Rahmen erhöht nach dem CSS-Boxmodell die Gesamtbreite. Also ist die dann mehr als 100%.

    Versuchs mal so:
    Code:
    #main &#123;
    margin&#58; 0 auto;
    width&#58; 80%;
    border&#58; 8px solid red;
    &#125;
    Siehe auch http://www.ohne-css.gehts-gar.net/0001.php

  4. #4
    Azubi(ne)
    Themenstarter

    Registriert seit
    22.12.2007
    Beiträge
    51
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    danke! funktioniert jetzt so wie gewünscht!

    könnte man statt
    Code:
    margin&#58; 0 auto
    auch das schreiben:
    Code:
    margin-left&#58; auto
    margin-right&#58; auto
    oder gibt es da kleine Unterschiede?

  5. #5
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    müsste auch so gehen...

    geht auch mit margin: 0 auto 0 auto;
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  6. #6
    Azubi(ne)
    Registriert seit
    20.06.2008
    Beiträge
    64
    Danke
    2
    Bekam 0 mal "Danke" in 0 Postings

    Standard Re: Website zentrieren mit CSS

    Zitat Zitat von felixstoessel
    main {
    margin-left: 10%;
    margin-right: 10%;
    width: 80%;
    }
    Ich würde margin-left und margin-right mal ganz raus nehmen, width:80%; so lassen und der <main> umschliessenden Box, was wohl <body> wäre, ein text-align:center; zuweisen.

  7. #7
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard Re: Website zentrieren mit CSS

    Zitat Zitat von LinuxMan
    Zitat Zitat von felixstoessel
    main {
    margin-left: 10%;
    margin-right: 10%;
    width: 80%;
    }
    Ich würde margin-left und margin-right mal ganz raus nehmen, width:80%; so lassen und der <main> umschliessenden Box, was wohl <body> wäre, ein text-align:center; zuweisen.
    das is ja prima, dann hat er den text zentriert aber der rest der page ist linksbündig
    bravo..
    operation misslungen, patient tot
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  8. #8
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    @LinuxMan:
    War wirklich kein guter, bzw. bereits schon längst veralteter Vorschlag. Synaptic hat erklärt weshalb.

    @felixstoessel:

    So wie von dir vorgeschlagen geht's natürlich auch.
    Aus Faulheit und zwecks Code-Erparnis verwendet man jedoch oft die Kurzschreibweise.
    Sieh dir zur Schreibweise mal hier Ziffer 5 an (gilt entsprechend auch für margin).

  9. #9
    Azubi(ne)
    Registriert seit
    20.06.2008
    Beiträge
    64
    Danke
    2
    Bekam 0 mal "Danke" in 0 Postings

    Standard Re: Website zentrieren mit CSS

    Zitat Zitat von synaptic
    dann hat er den text zentriert aber der rest der page ist linksbündig
    bravo..
    Nun gut, ich muss zugeben, ich habe das so noch nicht gemacht. Es müsste, soweit ich CSS Verstanden habe aber auf jeden Fall so gehen, wenn alles was zentriert werden soll ein Inline-Element ist.

  10. #10
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    dan kannst du ja den oben gezeigten code hernehmen und mal testen was so alles passieren kann.. poste hier dann bitte die ergebnise in form von code und bild
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. Website zentrieren? geht das?
    Von ThePB im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 20.09.2007, 18:03
  2. [HTML+CSS] Website horizontal zentrieren
    Von ::RMB:: im Forum Tutorials, Workshops und Anleitungen
    Antworten: 3
    Letzter Beitrag: 12.08.2007, 14:28
  3. Website mittig auf Bildschirm zentrieren?
    Von Player140 im Forum HTML & CSS Forum
    Antworten: 36
    Letzter Beitrag: 20.01.2007, 21:05
  4. Website Vertikal Zentrieren
    Von echo91 im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 12.10.2006, 17:06
  5. Flash Website im Browser zentrieren...
    Von Kaervekk im Forum Flash Forum
    Antworten: 2
    Letzter Beitrag: 11.10.2006, 12:15

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •