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

Problem mit divs - Fehlerhafte Einrückung

Status
Für weitere Antworten geschlossen.
S

Svenkan

Neues Mitglied
Hallo Leute!

Da es ein bisschen schwer ist das Ganze zu beschreiben, hier einfach direkt ma das Beispiel: Stundenplan der Klasse R06a

Das Problem ist, dass die divs 'Lehrer' und 'Raum' verschieden eingerückt sind.
Ich habe sonst auch nicht allzu viel mit HTML zutun und bin in diese div-Sachen nicht so reingewachsen.

Anbei noch der Code:

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Stundenplan der Klasse R06a</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta http-equiv="content-language" content="de" />
<meta name="description" content="Stundenplan (Demoschule) für Klasse R06a" />
<meta name="copyright" content="svPlan Ver. 8.0 © 1996-2008 by Georg Kallage" />
<meta http-equiv="expires" content="0">
<style type="text/css">
 <!--
 .splan { color: #444; font-size: 81.25%; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; margin: 0; padding: 0; }
 .uploaddatum{ font-size: 0.88em; position: absolute; top: 1em; left: 1em; }
 .klasse{ font-size: 0.88em; position: absolute; top: 1em; right: 1em; }
 .plan { border: solid 1px #525864; margin-top: 50px; }
 .splan table { font-size: 1em; width: 100%; }
 .splan td { margin: 0; padding: 3px 5px; vertical-align:top; border-right: 1px solid #fff; border-top: 1px solid #fff;  }
 .header { color: #fff; font-weight: bold; background-color: #747c8d; }
 .stunde_ungerade { background-color: #f1f5fa; }
 .stunde_gerade { background-color: #d2d8e2; }
 .stunde { border-left: 1px solid #fff; font-weight: bold; }
 .fach { vertical-align: top; float: left; font-weight: bold; }
 .lehrer { vertical-align: top; float: right; }
 .raum { float: right; margin-top:20px; }
 .baender { margin-left: 10px; margin-top: 5px; }
 -->
</style>
</head>
<body>
<div class="splan">
<div class="uploaddatum">Klasse R06a - Demoschule</div>
<div class="klasse">Stand: 18.05.2008, 19:35:30</div>
<div class="plan">
<table summary="Stundenplan" border="0" cellspacing="0" cellpadding="0">
<tr class="header">
<td class="stunde"></td>
<td width="19%">Montag</td>
<td width="19%">Dienstag</td>
<td width="19%">Mittwoch</td>
<td width="19%">Donnerstag</td>
<td width="19%">Freitag</td>
</tr>
<tr class="stunde_ungerade">
<td class="stunde" width="3%">1.</td>
<td width="19%"><div class="fach">En</div><div class="lehrer">Kbg</div><div class="raum">216</td>
<td width="19%"><div class="fach">Ku</div><div class="lehrer">Vor</div><div class="raum">Ku/2</td>
<td width="19%"><div class="fach">Ek</div><div class="lehrer">Wgr</div><div class="raum">216</td>
<td width="19%"><div class="fach">Mu</div><div class="lehrer">Mst</div><div class="raum">Mu/2</td>
<td width="19%"><div class="fach">De</div><div class="lehrer">Moh</div><div class="raum">216</td>
</tr>
<tr class="stunde_gerade">
<td class="stunde" width="3%">2.</td>
<td width="19%"><div class="fach">Po</div><div class="lehrer">Mus</div><div class="raum">143</td>
<td width="19%"><div class="fach">Ku</div><div class="lehrer">Vor</div><div class="raum">Ku/2</td>
<td width="19%"><div class="fach">Ph</div><div class="lehrer">Kru</div><div class="raum">Ph/1</td>
<td width="19%"><div class="fach">En</div><div class="lehrer">Kbg</div><div class="raum">216</td>
<td width="19%"><div class="fach">Bio</div><div class="lehrer">Gon</div><div class="raum">Bio/2</td>
</tr>
<tr class="stunde_ungerade">
<td class="stunde" width="3%">3.</td>
<td width="19%"><div class="fach">Ph</div><div class="lehrer">Kru</div><div class="raum">Ph/2</td>
<td width="19%"><div class="fach">Ma</div><div class="lehrer">Gon</div><div class="raum">216</td>
<td width="19%"><div class="fach">De</div><div class="lehrer">Moh</div><div class="raum">216</td>
<td width="19%"><div class="fach">Sp</div><div class="lehrer">Bre</div><div class="raum">Sp/H</td>
<td width="19%"><div class="fach">Mu</div><div class="lehrer">Mst</div><div class="raum">Mu/2</td>
</tr>
<tr class="stunde_gerade">
<td class="stunde" width="3%">4.</td>
<td width="19%"><div class="fach">Ge</div><div class="lehrer">Her</div><div class="raum">216</td>
<td width="19%"><div class="fach">Ge</div><div class="lehrer">Her</div><div class="raum">216</td>
<td width="19%"><div class="fach">En</div><div class="lehrer">Kbg</div><div class="raum">206</td>
<td width="19%"><div class="fach">Sp</div><div class="lehrer">Bre</div><div class="raum">Sp/H</td>
<td width="19%"><div class="fach">Verf</div><div class="lehrer">Kbg</div><div class="raum">216</td>
</tr>
<tr class="stunde_ungerade">
<td class="stunde" width="3%">5.</td>
<td width="19%"><div class="fach">Ma</div><div class="lehrer">Gon</div><div class="raum">216</td>
<td width="19%"><div class="fach">Ch</div><div class="lehrer">Lör</div><div class="raum">Ch/1</td>
<td width="19%"><div class="fach">Ma</div><div class="lehrer">Gon</div><div class="raum">216</td>
<td width="19%"><div class="fach">De</div><div class="lehrer">Moh</div><div class="raum">216</td>
<td width="19%"><div class="fach">En</div><div class="lehrer">Kbg</div><div class="raum">216</td>
</tr>
<tr class="stunde_gerade">
<td class="stunde" width="3%">6.</td>
<td width="19%"><div class="fach">De</div><div class="lehrer">Moh</div><div class="raum">216</td>
<td width="19%"></td>
<td width="19%"><div class="fach">=Re</div><div class="lehrer">*1</td>
<td width="19%"><div class="fach">Ma</div><div class="lehrer">Gon</div><div class="raum">216</td>
<td width="19%"><div class="fach">=Re</div><div class="lehrer">*1</td>
</tr>
</table>
</div>
<div class="baender"><b>*1:</b><ul style="list-style-type: none">
                <li>R06a: Koc - Rk - 131</li>
                <li>R06b: Koc - Rk - 131</li>
                <li>R06c: Koc - Rk - 131</li>
                <li>R06a: Sch - Re - 133</li>
                <li>R06b: Sch - Re - 133</li>
                <li>R06c: Sch - Re - 133</li>
</ul>
</div>
</div>
</body>
</html>
 
änder mal

.lehrer { vertical-align: top; float: right; }

in

.lehrer { vertical-align: top; text-align: right; }

dann siehts gut aus
 
Wäre auch nicht schlecht, wenn du die Breite des Stundenplans begrenzen würde. Auf 1440 Pixeln Breite sieht's nicht mehr so gut aus. ;)
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben