Ergebnis 1 bis 8 von 8

Thema: layout immer mittig, trotz pos. fixed

  1. #1
    HTML Newbie
    Registriert seit
    24.02.2010
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard layout immer mittig, trotz pos. fixed

    Hallo Leute,

    ich möchte gerne mein Layout so anpassen, dass es immer mittig im Browser ist. Leider gelingt mir das nicht. Ein einfaches Layout immer mittig zu bekommen, ist ja kein Problem, aber ich möchte gerne das nur die Mitte gescrollt werden kann und das der Scrollbalken immer rechts an der Seite ist (nicht mittig im Layout). Es ist soweit auch schon fertig, ich bekomme es nur nicht mittig ausgerichtet. Kann mir jemand HELFEN???


    hier der css-code:
    Code:
    img {border:0;}
    a:link {  color: #707070; } 
    a:visited  {  color: #707070; } 
    a:hover { color: #000000; } 
    a:active {   color: #707070; } 
    p,a,h2,h3,h4,ul,ol,li,div,td,th,input,select,textarea,address,blockquote,nobr  {
    font-family: verdana, arial, helvetica, sans-serif;
    font-weight:normal;
    font-size:  11px; 
    line-height: 17px;
    color: #707173;
    text-decoration:none;  
    }
       
    .rex-current {list-style-type: square;}
    
    .tinymcewysiwyg,p,h1,h2  {line-height: 2;}
    
    html, body {height:100%;}
    
    body{border:  black 0px dashed ;
    overflow: hidden;
    max-height: 90%;
    font-family:  Verdana, Arial, Sans-Serif;
    font-size: 0.7em;
    line-height:  1.25em;
    font-weight: normal;
    background-image:  url(../pics/back1.jpg);
    background-repeat: repeat-x;
    background-position:  0px 0px;
    background-color: #ffffff;
    margin:0;
    padding: 0;
    }
    
    #rlinks{
    border:  blue 0px dashed ;
    height: 100px;
    width: 100px;
    }
    
    #links{border:  red 0px dashed ;
    position: absolute;
    top: 0;
    bottom: 0;
    left:  100px;
    padding-left: 0px;
    width: 950px; 
    height: 100%;
    overflow:  hidden; 
    color: white;
    background-position:  0px 0px ;
    background-image:  url(../pics/hg2.jpg);
    }
    
    #hauptkasten{border: blue 0px dashed ;
    position:  fixed;
    top: 0;
    left: 350px;
    right: 0;
    bottom: 0;
    overflow:  auto;
    text-align: center;
    }
    
    #content
    {
    border: black  0px dashed ;
    width: 445px;
    padding-left: 30px;
    padding-rigt:  30px;
    line-height: 16px;
    text-align: left;
    background-image:  url(../pics/back3.jpg);
    background-repeat: repeat-y;
    min-height:  100%;
    }
    
    div#content img
    {border: black 0px dashed ;
    border:  0px;
    padding-left: -30px;
    margin-left: -30px;
    margin-top:  50px;
    margin-bottom: 25px;
    }
    
    #navigation {
    width: 180px;
    border:  black 0px dashed ;
    position: relative;
    top: 15px;
    right: 22px;
    bottom:  0;
    overflow: auto;
    text-align: right;
    float:right;
    color:  #7a6a46;
    }
    
    #content h2
    {
    line-height: 1.8em;
    font-weight:  normal;
    padding-right: 35px;
    text-align:justify;
    font-family:  Verdana, Arial, Sans-Serif;
    font-size: 11px; 
    color: #7a6a46;
    }
    hier kommt die html Seite:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01  Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
       <meta http-equiv="content-type" content="text/html;  charset=UTF-8">
      <link href="./css/styles.css"  rel="stylesheet" type="text/css">
      <title>test  </title>
    </head>
    <body>
    <div id="test">
    
    <div  id="rlinks"></div>
    <div id="links">
    <img  src="pics/logo.jpg" border="0" alt="logo" /><br />
    
    <div  id="navigation">navigation1<br /><br />navigation2<br  /><br />navigation3<br /><br />navigation4<br  /><br />navigation5<br /><br /></div>
    
    </div>
    
    
    <div  id="hauptkasten">
    
    
    
       <div  id="logo"></div>
       <div id="content"><div  class="content"><img src="pics/orange.jpg" border="0" alt=""  /><h2>cilisi. Donec id justo. Praesent porttitor, nulla vitae  posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem ut ipsum.  Curabitur suscipit suscipit tellus. Praesent vestibulum dapibus nibh.  Etiam iaculis nunc ac metus. Ut id nisl quis enim dignissim sagittis.  Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet  sapien, quis venenatis ante odio sit amet eros. Proin magna. Duis vel  nibh at velit scelerisque suscipit. Curabitur turpis.cilisi. Donec id  justo. Praesent porttitor, nulla vitae posuere iaculis, arcu nisl  dignissim dolor, a pretium mi sem ut ipsum. Curabitur suscipit suscipit  tellus. Praesent vestibulum dapibus nibh. Etiam iaculis nunc ac metus.  Ut id nisl quis enim dignissim sagittis. Etiam sollicitudin, ipsum eu  pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis ante odio  sit amet eros. Proin magna. Duis vel nibh at velit scelerisque suscipit.  Curabitur turpis.</h2><br /><br /><h2>cilisi.  Donec id justo. Praesent porttitor, nulla vitae posuere iaculis, arcu  nisl dignissim dolor, a pretium mi sem ut ipsum. Curabitur suscipit  suscipit tellus. Praesent vestibulum dapibus nibh. Etiam iaculis nunc ac  metus. Ut id nisl quis enim dignissim sagittis. Etiam sollicitudin,  ipsum eu pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis  ante odio sit amet eros. Proin magna. Duis vel nibh at velit scelerisque  suscipit. Curabitur turpis.cilisi. Donec id justo. Praesent porttitor,  nulla vitae posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem  ut ipsum. Curabitur suscipit suscipit tellus. Praesent vestibulum  dapibus nibh. Etiam iaculis nunc ac metus. Ut id nisl quis enim  dignissim sagittis. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus  ipsum laoreet sapien, quis venenatis ante odio sit amet eros. Proin  magna. Duis vel nibh at velit scelerisque suscipit. Curabitur  turpis.</h2></div>
       <div id="navi"></div>
    </div>
    </div>
    </body>
    </html>
    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
    Großmeister(in) Avatar von MyXoToD
    Registriert seit
    07.11.2007
    Ort
    Mainz
    Alter
    24
    Beiträge
    507
    Danke
    0
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: layout immer mittig, trotz pos. fixed

    Was willst du mit deinem Scrollbalken?^^
    Wenn du die Seite mittage haben willst, kannste ein div um die komplette Seite legen und dem div dann folgendes zuweisen:
    Code:
    #container {
    width: 900px; /* or what ever */
    margin: 0 auto;
    }
    PS:
    padding-rigt gibt es btw nicht
    und padding kann keine negativen werte haben
    Geändert von MyXoToD (16.06.2010 um 12:25 Uhr)
    Don't follow me, I run into walls.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    24.02.2010
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: layout immer mittig, trotz pos. fixed

    Hallo Santos, danke für deine Antwort. Leider ist das nicht ganz so einfach. Der Container ist jetzt ganz oden und schön brav in der Mitte. Nur leider der Inhalt nicht!
    Siehe online
    Irgend wie habe ich da einen Gedankenfehler drin!

    "Was willst du mit deinem Scrollbalken?^^" Es soll halt nur das Content <div> gescrollt werden und nicht der Rest. Was mache ich Falsch

  4. #4
    Großmeister(in) Avatar von MyXoToD
    Registriert seit
    07.11.2007
    Ort
    Mainz
    Alter
    24
    Beiträge
    507
    Danke
    0
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: layout immer mittig, trotz pos. fixed

    Alles was nicht scrollen soll bekommt einfach position: absolute; oder position: fixed; fertig
    Don't follow me, I run into walls.

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    24.02.2010
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: layout immer mittig, trotz pos. fixed

    Was mache ich jetzt falsch, das nichts mittig ist???

    Wenn ich jetzt alles in den neuen Container bringen möchte, muss ich ja position:absolut gegen relative tauschen. Dann habe ich es mittig! Nur leider ist der scrollbalken dann nicht in der mitte, da er ja position:fixed hat. Somit also nicht von dem Rand des neuen Containers mißt, sonder o.l. von Browser.

    Fällt dir noch was anderes ein???
    Geändert von dj-giver (16.06.2010 um 13:14 Uhr)

  6. #6
    Großmeister(in) Avatar von MyXoToD
    Registriert seit
    07.11.2007
    Ort
    Mainz
    Alter
    24
    Beiträge
    507
    Danke
    0
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: layout immer mittig, trotz pos. fixed

    Oh sry wenn du mit position absolute und fixed arbeitest dann funktioniert das zentrieren mit margin nicht mehr...
    Was anderes fällt mir ejtzt gerade nicht ein sorry :-/
    Don't follow me, I run into walls.

  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 AW: layout immer mittig, trotz pos. fixed

    geh mal logisch vor.. nimm 50% left und mach nen margin left mit nem negativen wert von der hälfte der gesamten breite deines umschliessenden divs (also hier des div test, was du übrigens dann ganz unten schliessen solltest...)
    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
    HTML Newbie
    Themenstarter

    Registriert seit
    24.02.2010
    Beiträge
    9
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: layout immer mittig, trotz pos. fixed

    Jo, das wars. Vielen Dank, es hat geklapt.

Ähnliche Themen

  1. Ebene immer mittig auf dem Bildschirm zentrieren.
    Von krieger98 im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 18.06.2009, 09:08
  2. Div Frame immer mittig zentriert ? ...
    Von Fragender im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 15.02.2009, 13:29
  3. Fixed Layout
    Von Billbos im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 19.08.2008, 18:17
  4. Tabellenüberschriften immer sichtbar machen, trotz scrollen
    Von dave_the_machine im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 0
    Letzter Beitrag: 09.11.2006, 16:57
  5. Layout passt trotz Bildschirmgrößentest nicht auf Monitor ?
    Von Heike2006 im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 12.10.2006, 09:56

Stichworte

Berechtigungen

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