Zu den Aufzeichnungen der tutorials.de-Live-Workshops
ERLEDIGT
NEIN
ANTWORTEN
4
ZUGRIFFE
337
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 24.08.10 20:05 #1
    JBJHJM JBJHJM ist offline Mitglied Silber
    Registriert seit
    Jan 2010
    Beiträge
    60
    Hallo!
    Habe ein Problem (vereinfacht):
    Im body soll ein div zentriert werden, aber nicht ganz mittig! links soll der Abstand zum Rand genau 150px größer sein! Bekomme ich das mit css noch hin oder muss ich das alles mit javascript berechnen lassen?

    Danke!
     
    Zitieren Zitieren
  2. 24.08.10 20:23 #2
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.099
    Hallo!

    Ja, das bekommt man mit CSS hin. Aber was willst du eigentlich (horizontal?) zentrieren?
     
    Zitieren Zitieren
  3. 24.08.10 20:35 #3
    JBJHJM JBJHJM ist offline Mitglied Silber
    Registriert seit
    Jan 2010
    Beiträge
    60
    Ein div mit fester Breite! Das Problem ist, dass ich links und rechts unterschiedlich breite menüs habe, die aber eine feste Breite haben, und mit position:absolute eingefügt sind. Nun soll der Hauptinhalt in der Mitte zwischen den beiden Leisten zentriert werden, was dann nur geht mit einem "verschobenen" margin:0 auto...
     
    Zitieren Zitieren
  4. 24.08.10 20:51 #4
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.099
    Dann versuch es mal so:
    HTML-Code:
    <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML5: Mini-Template</title>
    <style type="text/css">
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
        text-align: center;
        /* realisiert auch bei Uralt-Browsern eine horizontale Zentrierung,
           diese Eigenschaft wird vererbt! */
      }
      #wrapper {
        position: relative;
        right: 150px;
        width: 640px;
        height: 480px;
        margin: 0 auto; /* realisiert die horizontale Zentrierung bei modernen Browsern */
        text-align: left; /* nimmt die vererbte Eigenschaft für Uralt-Browser ggf. zurück */

        border: 1px solid #000;
        background-color: #ffc;
      }
    </style>
  </head>
  <body>
    <div id="wrapper">
      <!-- Seiteninhalt -->
    </div>
  </body>
</html>
    Wesentlich dabei ist, dass der WRAPPER-Block (relativ) positioniert ist. Dann kann man ihn auch in jede Richtung verschieben -> "right: 150px", wenn du eine Verschiebung nach links haben möchtest.
    Geändert von hela (24.08.10 um 20:53 Uhr) Grund: Korrektur im HTML
     
    Zitieren Zitieren
  5. 24.08.10 21:37 #5
    JBJHJM JBJHJM ist offline Mitglied Silber
    Registriert seit
    Jan 2010
    Beiträge
    60
    Wow, funktioniert einwandfrei! Dass ich nicht selber drauf gekommen bin, einfach mal left:100px zu setzen ... :P das war alles was noch fehlte

    Vielen Dank!
     
    Zitieren Zitieren
« DIV immer über ganze Seite | Hintergrundposition ändern bei focus »

Ähnliche Themen

  1. DIV-Container links verschoben, aber warum?
    Von tkliesch im Forum CSS
    Antworten: 1
    Letzter Beitrag: 12.06.10, 00:44
  2. Content zentrieren, aber Text nicht
    Von iTalk im Forum CSS
    Antworten: 11
    Letzter Beitrag: 05.06.10, 22:23
  3. Frame zentrieren.. aber wie?
    Von fla5hi im Forum HTML & XHTML
    Antworten: 2
    Letzter Beitrag: 06.02.09, 15:42
  4. Etwas dazuverdienen – aber wie?
    Von funnytommy im Forum Smalltalk
    Antworten: 7
    Letzter Beitrag: 06.04.06, 19:53
  5. swf zentrieren, aber wie?
    Von tatue im Forum HTML & XHTML
    Antworten: 12
    Letzter Beitrag: 25.11.04, 17:19