• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

800px centered seitenlayout

x_merlin_x

Neues Mitglied
Hallo zusammen,

ich möchte meine Seite von links bündig auf centered umstellen. Nun scheint mir das nur zu gelingen indem ich eine Tabelle erstelle mit 800px und im body sytle center steht. Ich würde aber ungern die ganzen Elemente in eine große Tabelle packen. Wenn ich aber ein DIV nehme, dann bleiben die Elemente darin auch im center. Ich will aber, das die 800px im center des browsers sind und die inhalte am linken rand der 800px bündig sind.

Das hier scheint leider nicht zu gehen:

Code:
<div style="width:800px;margin:0px;">
 <h1>Überschrift 1</h1>
</div>
Vielen Dank im vorraus für jeden Tipp
 
das stimmt, aber das Ergebnis ist das selbe. Der Text erscheint zentriert auf der seite. Er soll aber ein feld von 800 px abdecken, da links bündig sein und die 800px sollen zentriert sein.

Das hier hab ich im body:

Code:
body {
    margin:0; 
    padding:0;
    color:black;
    font-family:helvetica, arial, verdana, "宋体", SimSun;
    font-size: 12px;
        
    text-align: center; 
    overflow: -moz-scrollbars-vertical;
    background-color:FFFFFF;
    background-position: center; 
    background-repeat:repeat-y;
}
 
ok, da hast du auch recht. aber das löst nicht das problem.

Hier mal code um zu verdeutlichen was ich möchte. Es soll so aussehen wie in der tabelle, aber eben mit div.

Code:
<div style="width:800px;margin:0px;" align="center">
 <h1>geht nicht mit div</h1>
</div>


<table width="800" border="1" align="center">
    <tr>
        <td width="800" >so solls sein</td>
    </tr>
</table>
 
got it!

Code:
This is done by set*ting the width prop*erty on the ele*ment to a fixed value—say 800px—and then mak*ing the left and right mar*gins auto. This rule will pro*duce a con*tent area that is cen*tered in the browser win*dow and doesn’t expand or col*lapse with win*dow adjust*ments.
 
Stimmt, hast Du . Danke dafür. Ich hab hier nur so viel code auf der seite, dass ich den Wald nicht vor lauter Bäumen gesehen habe. Da muss mal ein sauberes redesign her :-)

Schönen Abend noch...
 
tja... ich glaub ich hab da was nicht unwesentliches übesehen. Kann es sein das das Ganze nur in XHTML 1.0 funktioniert?

Mit der DTD 4.01 transitional geht es in IE leider nicht:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Mit dieser hier schon aber die bringt mir eine Unmenge an Problemen:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
tja... ich glaub ich hab da was nicht unwesentliches übesehen. Kann es sein das das Ganze nur in XHTML 1.0 funktioniert?
Nein, das funktioniert mit jedem Doctype.

Mit der DTD 4.01 transitional geht es in IE leider nicht:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Der ist auch unvollständig, es fehlt der Verweis zur dtd, erst damit findet der Browser die Definitionen, an die er sich halten soll.

Mit dieser hier schon aber die bringt mir eine Unmenge an Problemen:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Der Doctype bringt dir nicht die Probleme, die hast du dann schon in deinem Code. Der Doctype zeigt sie dir jetzt nur an, weil er bisher nicht wusste, womit er deinen Code vergleichen sollte.

Wenn du ganz sauber arbeiten willst - was zu empfehlen wäre - dann verwende diesen Doctype
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Prüfe deine Seite mit dem Validator und behebe die Fehler, dann hast du auch viel weniger Probleme.
 
Zurück
Oben