Beiträge von sejuma

Ist korrekt so.

Zitat

body
{position:absolute;
margin: 0;
padding: 0;
font: 100% arial, hevetica, sans-serif;
text-align: center;
color: #505367;
background-color: gray;
z-index: 1;

width: 100%:
height: 100%;

}

#backgroundzwei
{
position:absolute;
margin: 1em auto;
width: 98%;
height: 815px;
text-align: left;
background-color: white;
border: 0px solid black;
z-index: 2;

}

#menu
{

width:920px; height:500px;
position:absolute;
margin: 10em auto;

text-align: left;
background-color: silver;
border: 0px solid black;
z-index: 3;

}

#contents
{
position:absolute;
margin-left: 180px;
height: 500px;
width:720;
background-color: #cccccc;
z-index: 4;
}

Alles anzeigen

Lass mal zunächst überall das Rote weg. Absolute Positionierungen sind gerade für den Anfänger meist "tödlich". Sie sollten nur eingesetzt werden, wenn man sich über deren Sinn klar ist. Nimm Positionierungen nur über margin und/oder float vor.
Füge das grüne ein.

Dann solltest du einheitliche Breiteneinheiten (blau) verwenden: Entweder px oder Prozent. Beides passt meist nicht unter einen Hut.
Bei #contents fehlt die Einheit.

Dann versuch's mal so, wenn ich den Aufbau richtig verstanden habe.

<div id="backgroundzwei">
<div id="menu">jjjj<br>
jjjjjjjjjj
</div><!--Ende menu-->
<div id="contents">hier stehen die wichtigen Inhalte damit ich bei Google ganz oben stehe </div> <!--Ende #contents-->
</div><!--Ende backgroundzwei-->

Suche dir vielleicht mal am besten ein fertiges Layout, das vom Aufbau her deinen Vorstellungen entspricht und passe das dann an.

Das scheint mir ein Fall für Faux Columns zu sein.

Wenn du mit Prozentwerten arbeitest, brauchen die eine Basis, worauf sie sich beziehen.
Deshalb solltest du unbedingt definieren:

html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}

Siehe auch flexibles Layout

Jeder iframe ist schon mal 80 % bereit. zwei zusammen also 160%. Dann haben sie noch Abstände. Alles in allesm sollten es nicht mehr als 100 % sein.
Reduziere die Werte und gib dann dem ersten ein "float: left;" in der Style-Angabe.
Im Übrigen solltest du alle Formatierungen mit CSS einheitlich machen und nicht mehr die veralteten Angaben verwenden.

Absolute Positionierungen sind meist absolut unnötig, wenn man sie nicht gezielt einsetzt.
Zentrierung deshalb besser so:

<img style="text-align: center;"  src="http://img5.imageshack.us/img5/696/topkopiexf3.png"border="0"width="700" height="400"><br>

oder

<img style="display: block; width: 700px; height: 400px; margin: 0 auto; border: none;" src="http://img5.imageshack.us/img5/696/topkopiexf3.png>

Horizontal zentrieren

Um das Problem genau zu beurteilen können, bräuchte man einen Link zur Seite.
Ich vermute, dass du absolute Positionierungen verwendest, die überflüssig sind.

Ein zentriertes Layout mit fixer Breite ist der richtige Ansatzpunkt.
Allerdings hat die Methode von Driver den Nachteil, dass bei kleinerem Viewport Inhalte verschwinden. Horizontal zentrieren deshalb besser so.

Vermutlich ist es wesentlich einfacher, wenn du alles neu beginnst.
Wenn die 50 Seiten im Grundlayout ähnlich sind, brauchst du eine "Musterseite", die du dann jeweils mit dem individuellen Inhalt füllen kannst. Den kannst du ja später rein kopieren. Allerdings nicht vom Quelltext aus, sondern eher vom "Frontend".
Zum Lernen ist dir evtl. meine Signatur behilflich und (falls du vorher Frames hattest) für den Umstieg speziell dies.

http://www.css4you.de/trickkiste/tr00029.html
http://www.css4you.de/wscss/css03.html#class

a.tabelle {

Da fehlt sowohl Inhalt, als auch eine schließende Klammer.

Versuch's mal so als Beispiel:

.tabelle {
color: #f00;
}

<table class="tabelle">
<tr>
<td>Inhalt</td>
</tr>
</table>

Jedes Element, dem du die Klasse "tabelle" zuweist, hat dann rote Schrift.

Geht auch nur für einzelne Zellen:

<table>
<tr>
<td  class="tabelle">Inhalt mit roter Schrift</td>
<td>Inhalt mit normaler Schrift</td>
</tr>
</table>

Sofern unterschiedliche Linkformatierung gewünscht, siehe hier.

Zitat

li.middle {
float: left;
clear: right;
width: 240px;
background: #FFEDA0;
border-top: none;
margin: 15px 15px 0 20px;
padding: 0;
}

Alles anzeigen

Ersetze mal die 20 durch 15

#containerdefault ist 800px breit.
Die drei Kästen innendrin dagegen 1020px. Also können sie da nicht reinpassen:
linke und rechte Box: 2 x 240px + 2 x 20px margin = 520px
.middle: 480px + 2 x 10px = 500px

Mit Nachteilen behaftet wegen Verpixelung: http://www.ohne-css.gehts-gar.net/0055.php

Das hatte ich probiert (Ausschlussprinzip), war aber nicht die Ursache.

Lass vielleicht mal margin und width weg und versuch's dafür mit padding.

Ich hab keine Ahnung, warum das so ist.
Aber wenn du hier den width-Wert rausnimmst, sollte es klappen:

Zitat

#text p {
margin-left : 0px;
margin-top : 0px;
margin-right : 15px;
margin-bottom : 15px;
width : 555px;
}

Alles anzeigen

Ist eigentlich eh' unnötig, da dieser durch den äußeren Div vorgegeben ist.

Horizontal zentrieren

Ich habe dein Problem ehrlich gesagt nicht verstanden.
Wenn deine Grafik der Teil ist, der nicht schwarz sein soll und der Rest soll schwarz sein, dann ginge das so:

body {
  background: #000 url(xyz.jpg) top center no-repeat;
}

Das ist in der Tat einer der wenigen Nachteile von CSS.
Dennoch: auf Tabellen würde ich deshalb trotzdem nicht umsteigen.