Zwei Spalten aber Inhalt zu tief

modstyle · 7. August 2006

Hi!

Bei einem Projekt an dem ich arbeite, habe ich folgendes Problem:

Das HTML/CSS-Layout hat zwei Spalten, von denen die Linke die schmalere ist und die Rechte den eigentlichen Seiteninhalt beherbergt.

Nun habe ich das Problem, dass im Firefox beim Einfügen von Formularen das Formular erst an der Stelle in der rechten Spalte anfängt, wo der Inhalt in der linken Spalte aufhört. Im Internet Explorer wird alles richtig (oder besser gesagt: so wie ich will) dargestellt.

Bei allen anderen Inhalten (z.B. auch Tabellen, die sogar breiter sind als die ausprobierten Formulare) funktioniert auch alles im Firefox.

Hat jemand vielleicht eine Idee warum gerade Formulare im Firefox verschoben werden!

Das ist jetzt ziemlich blöd, dass ich euch keinen HTML bzw. CSS Code zur Verfügung stellen kann aber ich habe momentan keinen Zugriff darauf. Aber vielleicht weiß ja einer von euch einen Unterschied in der Darstellung von Formularen zwischen IE und FF!

Also an den DIV-Containern kann es ja eigentlich nicht liegen, da diese ja alle anderen Inhalte korrekt darstellen.

Danke für die Hilfe!

Maik · 7. August 2006

Ohne Quelltextangaben ist es schwer zu sagen, was da bei dir momentan falsch läuft.

Was ich mir vorstellen könnte, ist folgendes Szenario:

Das linke DIV wird vom rechten DIV umflossen, und du hast für das rechte DIV keinen linken Außenabstand definiert, der der Breite des linken DIV entspricht.

Da Formulare ohne Breitenangabe immer auf die zur Verfügung stehenden Breite im Viewport ausgedehnt werden, dehnt der Firefox das Formular sozusagen auf eine 100%-Breite aus und zeigt es daher unterhalb der linken Spalte an.

Dies ist lediglich meine Vermutung, daher alle Angaben ohne Gewähr

modstyle · 7. August 2006

Hi!

Danke für die Vermutung!

Werde so schnell wie möglich versuchen den Quellcode zu posten.

Die Breiten der jeweiligen Container und des Formulars sind aber in Ordnung, habe das mit einer auffälligen Hintergrund-Farbe überprüft.
Deswegen bin ich so verzweifelt ich weiss einfach nicht mehr was daran falsch ist. Alle floats sind auch korrekt und werden gecleart usw.

Maik · 7. August 2006

Der Quelltext wird sicherlich mehr Licht ins Dunkel bringen und bei der Ursachenforschung behilflich sein.

modstyle · 8. August 2006

Hi!

So, habe nun wieder Zugriff auf meine Dateien

. Der CSS-Code ist ziemlich unübersichtlich und etwas durcheinander, weil ich noch in der Entwicklung bin und immer erst, wenn alles fertig ist aufräume, was eigentlich ein sehr schlechtes Vorgehen ist

CSS-Code:

Code:

BODY {
	margin: 0px;
    padding: 0px;
    background-image: url('gfx/bg.gif');
    background-repeat: repeat-x;
    background-color: #7B88B5;
    text-align: center;
}

#kopf {
	width: 900px;
    height: 115px;
    padding: 0px;
	margin: 0 auto;
    background-image: url('gfx/kopf.jpg');
    background-repeat: no-repeat;
}

#kopf ul {
    float: right;
	padding: 0px;
    margin: 0px;
    margin-top: 97px;
}

#kopf ul li {
    display: block;
    float: left;
    margin-right: 5px;
   	list-style: none;
}

#kopf ul li a {
	margin-right: 5px;
}

#kopf ul li, #kopf ul li a {
	font-family: Verdana, sans-serif;
    font-size: 11px;
	font-weight: bold;
    color: white;
    text-decoration: none;
    line-height: 130%;
}


#kopf ul li a:hover, #kopf ul li#aktiv_top a {
	text-decoration: underline;
}

#menu {
	width: 900px;
    height: 29px;
    margin: 0 auto;
    padding: 0px;
    background-color: #374B8F;
    border-top: 1px solid #E3AA45;
    overflow: hidden;
}

#menu ul {
	margin: 0px;
	padding: 0px;
}

#menu ul li {
	margin: 0px;
	padding: 0px;
	height: 29px;
	text-align: center;
	list-style: none;
	float: left;
}

#menu ul li a {
	margin: 0px;
	padding: 5px 0px 0px 0px;
	display: block;
    width: 150px;
	height: 29px;
	color: white;
	font-family: verdana, sans-serif;
	font-size: 14px;
    font-weight: bold;
	text-decoration: none;
    line-height: 130%;
}

#menu ul li a:hover, #menu ul li#aktiv_main a {
	background-color: #E3AA45;
}

#navipfad {
    width: 696px;
    height: 20px;
    margin: 0 auto;
    padding: 0px;
    padding-top: 3px;
    padding-left: 204px;
    background-image: url('gfx/grau.jpg');
    text-align: left;
}

#navipfad, #navipfad a {
	font-family: Verdana, sans-serif;
    font-size: 11px;
    color: black;
    text-decoration: underline;
    line-height: 130%;
    font-weight: normal;
}

#navipfad, #navipfad a:hover, #navipfad #aktiv_pfad a {
	text-decoration: none;
}

#navipfad #aktiv_pfad a {
	font-weight: bold;
}

#rahmen {
	width: 900px;
    margin: 0 auto;
    padding: 0px;
    padding-bottom: 50px;
    background-color: white;
    background-image: url('gfx/verlauf.jpg');
    background-repeat: no-repeat;
    text-align: left;
}

#clear {
	clear: both;
}

#submenu_rahmen {
	width: 203px;
    margin: 0px;
    padding: 0px;
    float: left;
}

#submenu, #submenu_inhalt {
	width: 203px;
    margin: 0px;
    padding: 0px;
}

#submenu_inhalt {
	width: 168px;
	padding-left: 15px;
	padding-right: 15px;
    margin-bottom: 20px;
}

#submenu_inhalt IMG {
	padding: 0px;
	margin: 0px;
}

#submenu ul {
	margin: 0px;
    margin-bottom: 50px;
    margin-left: 0px;
    padding: 0px;
    list-style: none;
}

#submenu ul li a {
	margin: 0px;
    margin-top: 7px;
	padding: 5px 0px 5px 20px;
	display: block;
    width: 183px;
	color: black;
	font-family: verdana, sans-serif;
	font-size: 11px;
    font-weight: bold;
	text-decoration: none;
    line-height: 130%;
}

#submenu ul li a:hover, #submenu ul li#aktiv_sub a {
	background-color: #E3AA45;
    color: white;
}

#submenu ul li#aktiv_sub ul {
	margin-bottom: 20px;
}

#submenu ul li#aktiv_sub ul li a {
	margin: 0px;
	margin-top: 5px;
	padding: 0px;
	padding-left: 30px;
	width: 160px;
	display: block;
	color: black;
	font-weight: normal;
	text-decoration: none;
	line-height: 130%;
	background-color: transparent;
}

#submenu ul li#aktiv_sub ul li a:hover, #submenu ul li#aktiv_sub ul li#aktiv_sub2 a {
	font-weight: bold;
	background-color: transparent;
	color: black;
}

#inhalt {
	width: 634px;
    padding: 30px;
    padding-bottom: 50px;
    padding-top: 20px;
    margin: 0px;
    margin-left: 203px;
}

P, A, H1, H2, H3, UL, LI, TD, TH, LEGEND, FORM, INPUT {
	font-family: Verdana, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: black;
    line-height: 150%;
}

H1, H2, H3, A, LEGEND {
	font-weight: bold;
	color: #374B8F;
}

H1, H2, H3 {
	margin: 0px !important;
	margin-bottom: 18px;
	margin-top: 10px;
    padding: 0px;
    padding-top: 15px;
    font-size: 17px;
}

H1 {
	margin-bottom: 7px;
}


DIV.csc-mailform-label {
	font-family: Verdana, sans-serif;
    line-height: 150%;
	font-weight: bold;
	color: #374B8F;
	margin: 0px !important;
	margin-top: 20px;
    padding: 0px;
    padding-top: 30px;
    font-size: 14px;
   	margin-bottom: 5px;
   	width: 570px;
}

H2, LEGEND {
    font-size: 14px;
}

H3 {
	font-size: 12px;
}

#submenu_inhalt H1, #submenu_inhalt H2, #submenu_inhalt H3, #submenu_inhalt P {
	margin: 0px;
    margin-top: 5px;
    padding: 0px;
}

a:hover {
	text-decoration: none;
}

UL {
	padding-bottom: 0px;
    padding-right: 50px;
    list-style-type: square;
}

UL LI {
	font-weight: bold;
    margin-bottom: 5px;
}

OL {
	padding-bottom: 0px;
    padding-right: 50px;
}

OL LI {
	font-weight: bold;
    margin-bottom: 5px;
}

UL LI OL {
	margin-top: 7px;
}

UL LI OL LI UL {
	margin-top: 7px;
}

UL LI OL LI {
	font-weight: normal;
}

UL LI OL LI UL LI {
	font-weight: normal;
	font-size: 11px;
}

TABLE {
	width: 620px;
    margin:0px;
}

FORM {
	margin-bottom: 15px;
}

#inhalt.FORM {
	width: 570px;
	padding: 0px;
}

TH, THEAD TR TD {
	background-color: #374B8F;
    font-weight: bold;
    color: white;
    padding: 5px;
   	vertical-align: top;
}

THEAD TR TD P {
    font-weight: bold;
    color: white;
    margin: 0px;
    padding: 0px;
}

TD P {
    margin: 0px;
    padding: 0px;
}

TD {
	background-color: #EEEEEE;
	padding: 5px;
	vertical-align: top;
}

TABLE CAPTION {
	font-family: Verdana, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: black;
    line-height: 150%;
    text-align: left;
    padding: 0px;
    margin: 0px;
    margin-top: 10px;
}


#abstand {
	width: 900px;
    height: 15px;
    margin: 0px;
    padding: 0px;
}


.csc-sitemap ul {
	margin-top: 30px;
}

.csc-sitemap ul li ul {
	margin-top: 15px;
	list-style-type: none;
}

.csc-sitemap ul li a {
	font-size: 14px;
}

.csc-sitemap ul li ul li a {
	font-size: 12px;
}

.csc-sitemap ul li ul li {
	background-color: #374B8F;
	padding: 0px;
}

.csc-sitemap ul li ul li a {
	display: block;
	padding: 5px;
	color: white;
}

.csc-sitemap ul li ul li ul {
	padding: 0px;
	padding-top: 10px;
	padding-bottom: 5px;
	margin: 0px;
	list-style-type: square;
}

.csc-sitemap ul li ul li ul li {
	margin-left: 70px;
}

.csc-sitemap ul li ul li ul li a {
	color: black;
	padding: 0px;
}

.csc-sitemap ul li ul li {
	padding: 1px;
}

.csc-sitemap ul li ul li ul, .csc-sitemap ul li ul li ul li {
	background-color: white;
}

.csc-sitemap ul li ul li ul {
	margin-top: 1px;
}

.csc-mailform-field {
	width: 570px;
	padding: 15px 0px 15px 0px;
	margin: 0px;
	border: 0px;
	clear: both;
}

.csc-mailform-field label {
	display: block;
	float: left;
	width: 150px;
	font-weight: bold;
}

.csc-sololabel {
	display: block;
	float: left;
	width: 450px;
	font-weight: bold;
	padding: 0px;
	margin: 0px;
	padding-top: 20px;
}

.csc-mailform-field input, .csc-mailform-field textarea, .csc-mailform-field select {
	display: block;
	float: right;
	width: 400px;
	border: 1px solid #374B8F;
	font-family: Verdana, sans-serif;
    font-size: 12px;
    color: black;
	line-height: 100%;
    text-align: left;
    vertical-align: center;
    padding: 2px;
    padding-bottom: 1px;
}

.csc-mailform-checkfeld {
	margin-left: 170px;
	margin-bottom: 5px;
	width: 400px;
	text-align: left;
	padding: 0px;
	padding-top: 7px;
}

.csc-mailform-checkfeld LABEL {
	float: none;
	width: 350px;
}

.csc-mailform-checkfeld INPUT {
	float: left;
	width: 15px;
	border: 0px;
	margin-right: 10px;
}

.csc-mailform-field select {
	width: 407px;
}

.csc-mailform-field input.csc-mailform-submit {
	float: right;
	width: 170px;
	height: 23px;
	line-height: 100%;
	border: 1px solid #E3AA45;
	background-color: #374B8F;
	font-weight: bold;
	color: white;
	text-align: center;
	padding-bottom: 3px !important;
	padding-bottom: 0px;
}

.csc-mailform-radio LEGEND {
	display: none;
}

.csc-mailform-radio FIELDSET {
	display: block;
	float: right;
	width: 400px;
	padding: 0px;
	border: 0px;
}

.csc-radio-abstand {
	margin: 0px;
	margin-bottom: 13px;
	margin-top: 13px;
}

.csc-mailform-radio FIELDSET INPUT {
	float: left;
	width: 15px;
	border: 0px;
	margin-right: 10px;
}

.csc-mailform-radio FIELDSET LABEL {
	width: 370px;
	margin-bottom: 7px;
}

.csc-textpic {
	padding: 0px;
}

.csc-textpic .csc-textpic-imagewrap .csc-textpic-image DT IMG {
	border: 1px solid #374B8F;
	display: block;
}

.csc-textpic .csc-textpic-imagewrap .csc-textpic-image DT {
	padding: 0px;
	margin: 0px;
}

.csc-textpic .csc-textpic-imagewrap {
	padding-top: 5px;
}

.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
	padding: 0px;
	margin: 0px;
}

.csc-textpic .csc-textpic-imagewrap .csc-textpic-caption {
	padding: 0px;
	padding-top: 5px;
	margin: 0px;
	font-family: Verdana, sans-serif;
    font-size: 11px;
    font-weight: normal;
    color: #374B8F;
    line-height: 135%;
}

.csc-textpic-intext-left-nowrap .csc-textpic-text {
	padding-left: 12px;
}

.csc-textpic-intext-right-nowrap .csc-textpic-text {
	padding-right: 12px;
}

.csc-textpic-intext-left .csc-textpic-imagewrap {
	padding-right: 7px;
}

A.external-link-new-window IMG, A.external-link IMG {
	border: 0px;
	padding: 0px;
	margin-right: 3px;
}


#suchwort {
	display: block;
	width: 155px;
	border: 1px solid #374B8F;
	font-family: Verdana, sans-serif;
    font-size: 12px;
    color: black;
    margin-bottom: 0px;
    line-height: 100%;
    text-align: left;
    vertical-align: center;
    padding: 2px;
    padding-bottom: 1px;
    margin-top: 5px;
}

#suchbutton {
	float: right;
	width: 80px;
	height: 23px;
	line-height: 100%;
	border: 1px solid #E3AA45;
	background-color: #374B8F;
	font-weight: bold;
	color: white;
	text-align: center;
	padding-bottom: 3px !important;
	padding-bottom: 0px;
	margin-top: 5px;
	margin-right: 6px;
}

.suchformular {
	margin: 0px;
	padding: 0px;
}

.csc-searchResultHeader {
	margin: 0px;
	padding: 0px;
	padding-top: 15px;
}

.csc-searchResultHeader A {
	font-size: 13px;
	font-weight: bold;
}

.csc-searchResult {
	font-size: 11px;
	margin: 0px;
	padding: 0px;
}

.spalter {
	padding: 0px;
	margin: 0px;
	width: 600px;
	background-color: white;
}

TABLE.spalter TR TD {
	background-color: white;
}

.spalter H1, .spalter H2, .spalter H3, .spalter P {
	margin: 0px;
	margin-top: 5px;
	padding: 0px;
}

.spalter H1, .spalter H2, .spalter H3 {
	padding-top: 5px;
}

.spalter H1 {
	padding: 0px;
	margin: 0px;
}

HTML-Code mit den relevanten DIV-Containern und Beispielinhalten:

Code:

<div id="rahmen">
<div id="submenu_rahmen">
<div id="submenu"><ul></ul></div>
<div id="submenu_inhalt"><!--TYPO3SEARCH_begin--><a id="c473"></a><div class="csc-textpic csc-textpic-center csc-textpic-above"><div class="csc-textpic-imagewrap" style="width:160px;"><dl class="csc-textpic-image csc-textpic-lastcol" style="width:160px;"><dt><img src="uploads/pics/qm_siegel_01.jpg" width="160" height="160" border="0" alt="Qualitätsmanagement Siegel" title="Qualitätsmanagement Siegel" /></dt><dd class="csc-textpic-caption"></dd></dl></div></div><div class="csc-textpic-clear"><!-- --></div><a id="c468"></a><h2>Partnerzentrum</h2><p>Wir sind Partnerzentrum der VisuMed AG. Weitere Informationen hierzu erhalten Sie unter <a href="http://www.visumed.de" target="_blank" class="external-link-new-window"><img alt="Öffnet einen externen Link in einem neuen Fenster" src="fileadmin/icons/link_ext.gif" />www.visumed.de</a>.</p><!--TYPO3SEARCH_end--></div>
</div>
<div id="inhalt"><!--TYPO3SEARCH_begin--><a id="c321"></a><table border="0" cellspacing="0" cellpadding="0" width="620px" class="spalter">
<tr>
<td width="300px;" valign="top"><a id="c322"></a><h1>Freiheit ohne Brille</h1><p>Träumen Sie davon, unbeschwert zu joggen, zu schwimmen oder zu golfen? Oder möchten Sie einfach nur morgens aufwachen und ohne Brille und Kontaktlinsen sehen?<br /> Im Zentrum für Refraktive Chirurgie Münster praktizieren erfahrene Augenärzte Lasik, Lasek und andere medizinische Behandlungen mit genau diesem Ziel.<br /> Nutzen Sie jetzt die Vorzüge eines neuen Excimer Lasers mit einzigartiger Iriserkennung, durch die nun eine noch genauere Nachführung des Behandlungsstrahls entsprechend Ihren Augenbewegungen möglich ist.
</p>
<p><strong>Wir freuen uns auf Sie!<br /><br /></strong></p></td>
<td width="20px;" valign="top"></td>
<td width="300px;" valign="top"><a id="c323"></a><p><img src="fileadmin/start_info.jpg" style="width: 302px; height: 155px;" alt="" /><br />Blindtext fasd fasdf asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas as ffasd fasdf. Die <strong>Informations-Abende im Zentrum</strong> asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas as ffasd fasdf asfd asdf asdfa sfas.
</p>
<p><a href="infoabend-veranstaltungen.html" class="internal-link">Weiteres zum Info-Abend</a></p></td>
</tr>
</table><a id="c324"></a><table border="0" cellspacing="0" cellpadding="0" width="620px" class="spalter">
<tr>
<td width="195px;" valign="top"><a id="c325"></a><h1>Wir über uns</h1><div class="csc-textpic csc-textpic-center csc-textpic-above"><div class="csc-textpic-imagewrap" style="width:195px;"><dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:195px;"><dt><img src="uploads/pics/start_ueberuns.jpg" width="195" height="147" border="0" alt="Das Team vom Zentrum für Refraktive Chirurgie Münster" title="Das Team vom Zentrum für Refraktive Chirurgie Münster" /></dt><dd class="csc-textpic-caption"></dd></dl></div><div class="csc-textpic-text"><p>Lernen Sie das Zentrum für Refraktive Chirurgie Münster kennen und erfahren Sie, was wir für Sie tun können: <a href="wir-ueber-uns.html" class="internal-link">Über das Zentrum</a>.
</p>
<p>&nbsp;</p></div></div><div class="csc-textpic-clear"><!-- --></div></td>
<td width="17px;" valign="top"></td>
<td width="195px;" valign="top"><a id="c327"></a><h1>Erfahrungsberichte</h1><div class="csc-textpic csc-textpic-center csc-textpic-above"><div class="csc-textpic-imagewrap" style="width:195px;"><dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:195px;"><dt><img src="uploads/pics/start_erfahrungsberichte.jpg" width="195" height="145" border="0" alt="Auge am Messgerät" title="Auge am Messgerät" /></dt><dd class="csc-textpic-caption"></dd></dl></div><div class="csc-textpic-text"><p>Informationen aus erster Hand: Lesen Sie <a href="erfahrungsberichte.html" class="internal-link">Erfahrungsberichte</a> unserer Patienten und erleben Sie eine Operation aus deren Blickwinkel. </p></div></div><div class="csc-textpic-clear"><!-- --></div></td>
<td width="17px;" valign="top"></td>
<td width="195px;" valign="top"><a id="c328"></a><h1>Onlineberatung</h1><div class="csc-textpic csc-textpic-center csc-textpic-above"><div class="csc-textpic-imagewrap" style="width:195px;"><dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:195px;"><dt><img src="uploads/pics/start_onlineberatung.jpg" width="195" height="145" border="0" alt="weibliche Hand tippt auf Laptop-Tastatur" title="weibliche Hand tippt auf Laptop-Tastatur" /></dt><dd class="csc-textpic-caption"></dd></dl></div><div class="csc-textpic-text"><p>Sie fragen sich, ob und wenn ja, für welche Behandlung Sie in Frage kommen? Für eine erste, ärztliche Einschätzung bieten wir Ihnen unseren <a href="online-fragebogen.html" class="internal-link">Online-Fragebogen</a>.</p></div></div><div class="csc-textpic-clear"><!-- --></div></td>
</tr>
</table><!--TYPO3SEARCH_end--></div>
<div id="clear"></div>
</div>
<div id="abstand"></div>

Zur Erklärung: Wenn ich den obigen HTML-Code im IE aufrufe, dann startet der Inhalt erst da, wo "submenu_inhalt" aufhört, im Firefox ist aber alles ganz normal.

Wenn ich aber im Inhalts-Bereich ein Formular und in "submenu_inhalt" andere Inhalte habe, dann sieht es im IE normal aus aber im Firefox fängt das Formular erst da an, wo "submenu_inhalt" aufhört.

Wenn ganz normale Inhalte (ohne Formulare und Tabellen) drin sind, dann wird es in beiden Browsern korrekt dargestellt.

D.h. im IE sind die Tabellen zu breit und im Firefox die Formulare oder wie!?

Danke für die Hilfe!

Maik · 8. August 2006

Da meine Mittagspause gleich wieder rum ist und ich auf'm Sprung zurück ins Office bin, kann ich mir das Konstrukt erst am frühen Abend genauer anschauen.

Vielleicht solltest du bis dahin den CSS-Code in eine chronologische Reihenfolge bringen, damit man sich als Außenstehender darin leichter zurechtfindet.

modstyle · 8. August 2006

Hi!

Sorry, hatte ich auch vor aber ich hab dummerweise 0 Zeit und ich muss heute wahrscheinlich sowieso mehr Überstunden machen als der Tag eigentlich bietet

.

Quaese · 8. August 2006

Hi,

es handelt sich offensichtlich um einen IE-Bug, wenn nicht-gefloatete Elemente neben gefloatete Elemente gesetzt werden.
In solchen Fällen verdoppelt das MS-Produkt die padding-Werte.

Versuch mal das Nachstehende:

Code:

#inhalt {
    width: 634px;
    padding: 20px 30px 50px 30px !important;
    padding: 20px 30px 50px 15px;            /* padding-left-Wert für IE halbieren */
    margin: 0 0 0 203px;
}

Ciao
Quaese

modstyle · 8. August 2006

Hi!

Danke für die Antwort! Jetzt sitzt der Inhalt beim IE immer richtig Klingt jetzt doof, aber:
*virtuell dem Quaese eine Kiste Bier ausgeb*

Jetzt bleibt nur noch das Problem, dass die Formulare im Firefox nach unten verrutschen. Vielleicht ist es ja was ähnliches wie der IE-Bug. Morgen habe ich zum Glück mehr Zeit mich damit auseinanderzusetzen und werde den Fehler vielleicht selbst finden.
Wenn dem so sein sollte, werde ich das natürlich sofort hier posten.

Danke für die bisherige Hilfe

Maik · 8. August 2006

In dem HTML-Attribut width wird keine Einheit und auch kein Semikolon notiert:

HTML:

<!-- aus -->
<td width="300px;" valign="top">

<!-- wird -->
<td width="300" valign="top">

Zwei Spalten aber Inhalt zu tief

modstyle

Mitglied

Maik

modstyle

Mitglied

Maik

modstyle

Mitglied

Maik

modstyle

Mitglied

Quaese

Moderator

modstyle

Mitglied

Maik

Neue Beiträge