nicht angemeldet
Hallo,
Weil margin:auto bei standardkonformen Rendering (und text-align:center als Workaround für alte IEs) schon genannt wurde. Diese Variante hat den Vorteil, dass man auch mit min- und max-width arbeiten kann und bei zu kleinem Viewport bekommt man zumindest einen Scrollbalken.
Ok, ich habe zu diesem Zweck mal folgendes gebastelt.
<?xml version="1.0" encoding="UTF-8"?>
<!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" xml:lang="de" lang="de">
<head>
<title>Marginauto</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8"/>
<meta http-equiv="content-style-type" content="text/css"/>
<style type="text/css">
body {
margin:auto auto auto auto; padding:0;
text-align:center;
}
#Content {
width:800px;
margin:0px auto;
text-align:left;
border:1px dotted #333;
background-color:#DDD;
}
</style>
</head>
<body>
<div id="Content">
Text Test Test Test Text Text Test Test Test Text Text Test Test Test Text Text Test Test Test Text Text Test Test Test Text
</div>
</body>
</html>
man verliert den Inhalt links zwar nicht mehr, und bis zu einer gewissen Breite den Inhalt rechts auch nicht, aber ab einer gewissen Grenze ist der Inhalt am äußersten rechten Rand ebenfalls abgeschnitten. Im Endeffekt hat man wieder Information verloren, weil man diesmal mit dem Scrollbalken nicht mehr so weit rüber kommt, dass man noch alle Inhalte sieht.
Oder kann man es irgendwie noch besser machen?
Markus
--
