Abstand von der Mitte definieren

  1. senor_coconut

    senor_coconut Thread Starter MacUser Mitglied

    Mitglied seit:
    07.01.2006
    Beiträge:
    209
    Zustimmungen:
    4
    Hallo,

    ist es möglich per html oder css zu definieren, dass bestimmte Objekte (Bilder, Texte...) einen bestimmten Abstand nach links oder rechts von der Seitenmitte haben?


    danke
     
  2. neuni

    neuni MacUser Mitglied

    Mitglied seit:
    20.10.2006
    Beiträge:
    413
    Zustimmungen:
    15
    Könntest die Objekte zentrieren und dann mit position: -10px; nach links bzw. mit positivem wert nach rechts verschieben.
     
  3. senor_coconut

    senor_coconut Thread Starter MacUser Mitglied

    Mitglied seit:
    07.01.2006
    Beiträge:
    209
    Zustimmungen:
    4
    wie geht das konkret?mit div's?
     
  4. PowerBookGrafik

    PowerBookGrafik MacUser Mitglied

    Mitglied seit:
    12.03.2005
    Beiträge:
    812
    Zustimmungen:
    5
    ja mit divs und dann die position der divs im css angeben !
     
  5. senor_coconut

    senor_coconut Thread Starter MacUser Mitglied

    Mitglied seit:
    07.01.2006
    Beiträge:
    209
    Zustimmungen:
    4
    ok danke!
     
  6. neuni

    neuni MacUser Mitglied

    Mitglied seit:
    20.10.2006
    Beiträge:
    413
    Zustimmungen:
    15
    Mittig anordnen am besten so:
    Code:
    <html...blabla
    <head>
    <style type="text/css">
    
    body {
    text-align: center;
    }
    
    #page {
    margin: 0px auto;
    text-align: left;
    width: 200px;
    position: relative;
    left: -10px;
    }
    </style>
    ....
    <body>
    
    <div id="page">
    Ich bin von der Mitte aus 10 Pixel nach rechts verschoben.
    </div>
    
    </body...
    
    Nicht getestet, sollte aber klappen.
     
  7. hero1977

    hero1977 MacUser Mitglied

    Mitglied seit:
    19.06.2006
    Beiträge:
    1.602
    Zustimmungen:
    19
    so is alles mittig:

    PHP:
    <html>
    <
    head>
    <
    style type="text/css">
    <!--
    #mittig {
        
    margin: -180px 0px 0px -250px;
        
    width:500px;
        
    height:360px;
        
    top50%; 
        
    left50%;
        
    border:dashed 2px #00CCCC;
        
    overflowauto;
        
    position:absolute;
        
    z-index:1;
    }
    -->
    </
    style>
    </
    head>
    <
    body>
    <
    div id="mittig">
      <
    div align="center">mittig is geil!</div>
    </
    div>
    </
    body>
    </
    html>
     
  8. senor_coconut

    senor_coconut Thread Starter MacUser Mitglied

    Mitglied seit:
    07.01.2006
    Beiträge:
    209
    Zustimmungen:
    4
    danke nochmals an alle.hab gerade ein kleines problem:

    HTML:
    <html>
    <head>
    <style type="text/css">
    
    <!-- 
    #header {
             margin: auto
             position: absolute; 
             width: 690px;
             height: 163px;
             background-color: #444444;
             text-align: center;
         
    
    -->
    </style> 
    </head>
    <body> 
    
    <div id="header">
    </div>
    </body> 
    </html> 
    
    

    ich will das die graue box in die mitte kommt.aber irgenwie gehts nicht...was mach ich falsch?
     
  9. tigion

    tigion MacUser Mitglied

    Mitglied seit:
    21.06.2006
    Beiträge:
    1.091
    Zustimmungen:
    48
    Fehlt das schliessende '}' jetzt durch die Formatierung des Forums?

    So vieleicht?

    Code:
    <html>
      <head>
        <style type="text/css">
          <!-- #header {
            margin: auto;
            position: [COLOR="Red"][B]relative[/B][/COLOR];
            width: 690px;
            height: 163px;
            background-color: #444444;
            text-align: center;
          } -->
        </style>
      </head>
      <body>
        <div id="header"> </div>
      </body>
    </html>
     
  10. senor_coconut

    senor_coconut Thread Starter MacUser Mitglied

    Mitglied seit:
    07.01.2006
    Beiträge:
    209
    Zustimmungen:
    4
    jop hab ich vergessen.ne liegt nicht daran...
     
Die Seite wird geladen...