Ergebnis 1 bis 6 von 6

Thema: Website mittig ohne Rukler bei Scrollbalken

  1. #1
    Unregistriert
    Gast

    Standard Website mittig ohne Rukler bei Scrollbalken

    Guten Tag zusammen

    Ich möchte meine Website mittig machen, dies habe ich nun mit Margin links und rechts auto gemacht.

    Sobald ich jedoch so viel schreibe, dass ein Scrollbalken benötigt wird, verschiebt sich die Seite ganz wenig nach links, wie kann ich machen, dass dies nicht passiert?
    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
    Unregistriert
    Gast

    Standard AW: Website mittig ohne Rukler bei Scrollbalken

    css:

    Code:
    #container {
    background-color: white;
    width: 800px;
    margin-top:0px;
    margin-bottom:100px;
    margin-left: 50%-400px;
    position:static;
    }
    #header {
    width: 550px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    }
    
    #navigation{
    color: white;
    font-size: 20px;
    }
    
    #navigation  table{ 
    width: 800px;
    background-color: #054B63;
    border-color: black;
    border-style: solid;
    }
    
    #navigation a{
    text-decoration: none;
    color: white;
    }
    
    #navigation a:hover{
    color: 	#708090;
    text-decoration: underline;
    }
    
    #center{
    text-align: center;
    }
    
    #me{
    float:right;
    }
    html seite (zensiert)

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>beispieltext</title>
    <meta http-equiv="Content-Language" content="English" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="style.css" media="screen" />
    </head>
    
    <body>
    <div id="container">
    <div id="header">
    <img width="550px" height="200px"  src="./images/header.jpg" alt="Hier w&auml;re das Bild vom Header" />
    </div>
    <div id="navigation">
    
    <table>
    <col width="355px" />
    <col width="400px" />
    <tr>
    <td>
    <a href="index.html"> adaf </a>
    </td>
    <td>
    <a href="cv.html">erasdf</a>
    </td>
    <td>
    <a href="contact.html"> test test  </a>
    </td>
    </tr>
    </table>
    
    </div>
    
    <h2>blabla</h2>
    <div id="me">
    <img width="192px" height="288px" src="./images/me.jpg" alt="Hier w&auml;re ein Bild von mir" />
    </div>
    <table width="500px">
    	<col width="200px" />
    	<col width="300px" />
    	<tr>
    		<td>
    			asdf 
    		</td>
    		<td>
    			asdf
    		</td>
    	</tr>
    	<tr>
    		<td>
    adf		</td>
    		<td>
    			asdf
    		</td>
    	</tr>
    	<tr>
    		<td>
    			asdfer 
    		</td>
    		<td>
    			asdf ewf
    		</td>
    	</tr>
    	<tr>
    		<td>
    			adsffeww		
    		<br />
    		</td>
    		<td>
    		asdf
    		</td>
    	</tr>
    	<tr>
    		<td>
    		&nbsp;
    		</td>
    		<td>
    		&nbsp;
    		</td>
    	</tr>
    	<tr>
    		<td>
    			asdf
    		</td>
    		<td>
    		dfawe
    		</td>
    	</tr>
    	<tr>
    		<td>
    		&nbsp;
    		</td>
    		<td>
    		&nbsp;
    		</td>
    	</tr>	
    	<tr>
    		<td>
    		 asdfea
    		</td>
    		<td>
    		naedsfaew
    		</td>
    	</tr>
    	<tr>
    		<td>
    		&nbsp;
    		</td>
    		<td>
    		&nbsp;
    		</td>
    	</tr>
    	<tr> 
    		<td>
    			asdfae
    			<br />
    			<br />
    			<br />
    			<br />
    			<br />
    		</td>
    		<td>
    		asdfaeaf<br />
    		asdfae <br />
    		waerasdf<br />
    		aerafsd <br />
    		asdfea <br />
    		</td>		
    	</tr>	
    	
    <tr>
    		<td>
    		<p>	asdfe </p>
    		</td>
    	</tr>
    	<tr>
    		<td>
    		asdfawef
    		</td>
    		<td>
    		asdfawe
    		</td>
    	</tr>
    		<tr>
    		<td>
    		asdfew
    		</td>
    		<td>
    		Gasdfasefch
    		</td>
    	</tr>	
    		<tr>
    		<td>
    			asdfewatgg
    		</td>
    		<td>
    		adsgfeasdav ad afdae fa
    		</td>
    	</tr>	
    </table>
    <br />
    <h2> asdgas df</h2>
    <p>asdf asdf </p>
    Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machen<br />
    Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machen.Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machen<br />
    Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machenBeispieltext, möchte Seite nicht online stellen und nicht öffentlich machen.<br />
    Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machen.<br />
    <br />
    		
    <p>asdfaew</p>
    
    Beispieltext, möchte Seite nicht online stellen und nicht öffentlich machen blablablabla <br />
    blablablablablablablabla blablablabla blablablabla blablablablablablablablablablablablablablablabla<br />
    blablablablablablablablablablabla blablablablabla<br />
    -blablablabla blablablabla blablablabla blablablabla r<br />
    -blablablabla vblablablabla blablablabla blablablabla blablablabla blablablabla<br />
    <br />
    blablablabla blablablabla blablablabla blablablabla blablablabla blablablabla blablablabla <br />
    blablablablablablablabla blablablabla blablablabla blablablabla blablablabla blablablablablablablablablablablablablablablablablablablablablablablablablablablabla blablablabla blablablabla blablablabla blablablabla blablablabla<br />
    blablablabla blablablablablablablablablablablablablablablablablablablabla  blablablabla blablablabla blablablabla blablablabla blablablabla blablablabla blablablabla blablablabla.<br />
    blablablabla blablablabla blablablablablablablablablablablablablablablablablablablabla blablablabla .<br />
    blablablabla blablablabla blablablabla blablablablablablablablablablablablablablablablablablablablablablablabla blablablabla blablablabla<br />
    
    </div>
    </body>
    </html>

  3. #3
    der/die Göttliche Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Website mittig ohne Rukler bei Scrollbalken

    ähm, gar nicht, soweit ich weiss.

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

    Standard AW: Website mittig ohne Rukler bei Scrollbalken

    Gib html einen height-Wert von 101%, siehe http://www.ohne-css.gehts-gar.net/0052.php.
    Dann ist der Scrollbalken permanent vorhanden und die Seite verschiebt sich nicht mehr.

  5. #5
    Unregistriert
    Gast

    Standard AW: Website mittig ohne Rukler bei Scrollbalken

    genau so habe ich es nun gemacht

  6. #6
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Website mittig ohne Rukler bei Scrollbalken

    Ich verwende dafür

    Code:
    html { overflow-y: scroll; }
    Das Problem betrifft ohnehin nur einige Browser die nicht von Microsoft stammen. Daher kann man das ruhig so schreiben statt height zu missbrauchen.

Ähnliche Themen

  1. Position : Absolute, mittig, allerdings ohne feste breite
    Von Alienx im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 07.03.2009, 16:27
  2. DIV Container mittig zentrieren
    Von martinfre im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 14.01.2009, 13:32
  3. Scrollbarer Text OHNE Scrollbalken?
    Von Toooooni im Forum Flash Forum
    Antworten: 6
    Letzter Beitrag: 28.01.2008, 12:19
  4. Website mittig auf Bildschirm zentrieren?
    Von Player140 im Forum HTML & CSS Forum
    Antworten: 36
    Letzter Beitrag: 20.01.2007, 21:05
  5. Mittig im Frame
    Von Lollana im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 26.05.2005, 22:08

Stichworte

Berechtigungen

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