Td im zusammenhang mit den margin befehl

Hallo zusammen,

folgendes wollte ich machen:
td1 soll auf eine feste Position, und td2 mit Abstand drunter, der Abstand sollte über den Befehl margin gemacht werden, das sich td1 height verändert, der Abstand zw td1 und td2 aber gleich bleiben soll. Hoffe mal ihr versteht was ich meine.

So der Code zum testen sieht sieht so aus, aber habe auch schon viele andere Varianten ausprobiert:

<table>
<tr>
<td style="position:absolute; top:175px; left:200px;
margin-bottom:100px;"> TD1 </td>
</tr>
<tr>
<td style="position:absolute; left:200px;
margin-top:100px"> TD2 </td>
</tr>
</table>

leider tun die nicht was ich will

Kann mir jemand helfen ?
Vielen dank schon mal im Vorraus!

PS: Aso, ja will es später in CSS ablegen, nur zum testen, dachte ich, so ist es besser zum erklären.
Detlef

Hallo,

Also ich Versuche es nochmal zuerklären:

Die erste Zelle (td1) so eine feste Postion zugewiesen bekommen. Die Höhe dieser Zelle ist veränderbar, also nicht fest. Die nächste Zelle (td2) soll drunter stehen , dies aber mit einen bestimmen Abstand, der immer gleich sein soll, egal wie Hoch Zelle 1 ist. Wird die höhe der Zelle 1 verändert, sollte sich Zelle 2 den entsprechend bewegen (verschieben)

Hoffe das ich nun rüber gebracht habe, was ich haben möchte.

Gruss Detlef

Hallo,

habe es hinbekommen, nehme anstand <td> einfach <p>, dann klappt das ohne Probleme, danke trotzdem.

Gruss Detlef

Klar kann ich das machen, ist noch ein wenig lang, muss ich noch kürzen, aber man sieht schon was ich machen will.
Denke das man den CSS Code noch um einiges verkürzen kann, aber da muss ich noch dran, mit den Div bekomme ich es irgendwie noch net so richtig geregelt, aber wie sagt man so schön, Testen und ausprobieren.

html Code:

<!-- Themenfenstermitte -->
<!-- Themenfenster 1 Ueberschrift -->
<p class="Thematitel1" > Test1

</p>
<!-- Themenfenster 1 Ueberschrift ENDE-->

<!-- Themenfenster 1 Inhalt -->
<p class="FensterInhalt1"> Test1

</p>
<!-- Themenfenster 1 Inhalt ENDE-->

<!-- Themenfenster 2 Ueberschrift -->
<p class="Thematitel2" > Test2

</p>
<!-- Themenfenster 2 Ueberschrift ENDE-->

<!-- Themenfenster 2 Inhalt -->
<p class="FensterInhalt2" > Test2

</p>
<!-- Themenfenster 2 Inhalt ENDE-->
<!-- Themenfenstermitte ENDE-->

CSS Code ( CSS Datei)

/*Fenster Thema Mitte */
.Thematitel1{
font: 9pt/12pt; /*Grösse Schrift bestimmen*/
font-family:Arial; /*Schrifttyp*/
width= 400; /*breite*/
height: 20; /*höhe*/
background-color :87CEFF; /*Hintergrundfarbe*/
border-style: solid; /*Rahmen bestimmen*/
border-color: 87CEFF; /*Rahmen Farbe Überschrift*/
border-top-width: 0.05cm; /*Rahmenbreite oben*/
border-bottom-width: 0.05cm; /*Rahmenbreite unten*/
border-left-width: 0.05cm; /*Rahmenbreite links*/
border-right-width: 0.05cm; /*Rahmenbreite rechts*/
padding: 0em 0em 0em 1em; /*Abstände Überschrift */
position:relative; top:140px; left:300px; /*Position*/
margin-top: 200px; /*Abstand nach oben */
}

.FensterInhalt1{
font: 9pt/12pt; /*Grösse Schrift bestimmen*/
font-family:Arial; /*Schrifttyp*/
width= 400; /*breite*/
background-color :white; /*Hintergrundfarbe*/
border-style: solid; /*Rahmen bestimmen*/
border-color: 87CEFF; /*Rahmen Farbe Überschrift*/
border-top-width: 0.05cm; /*Rahmenbreite oben*/
border-bottom-width: 0.05cm; /*Rahmenbreite unten*/
border-left-width: 0.05cm; /*Rahmenbreite links*/
border-right-width: 0.05cm; /*Rahmenbreite rechts*/
padding: 0em 0em 0em 1em; /*Abstände Überschrift */
position:relative; top:140px; left:300px; /*Position*/
margin-top: -20px; /*Abstand nach oben */
}

.Thematitel2{
font: 9pt/12pt; /*Grösse Schrift bestimmen*/
font-family:Arial; /*Schrifttyp*/
width= 400; /*breite*/
height: 20; /*höhe*/
background-color :87CEFF; /*Hintergrundfarbe*/
border-style: solid; /*Rahmen bestimmen*/
border-color: 87CEFF; /*Rahmen Farbe Überschrift*/
border-top-width: 0.05cm; /*Rahmenbreite oben*/
border-bottom-width: 0.05cm; /*Rahmenbreite unten*/
border-left-width: 0.05cm; /*Rahmenbreite links*/
border-right-width: 0.05cm; /*Rahmenbreite rechts*/
padding: 0em 0em 0em 1em; /*Abstände Überschrift */
position:relative; top:140px; left:300px; /*Position*/
margin-top: 40px; /*Abstand nach oben */
}

.FensterInhalt2{
.FensterInhalt1{
font: 9pt/12pt; /*Grösse Schrift bestimmen*/
font-family:Arial; /*Schrifttyp*/
width= 400; /*breite*/
background-color :white; /*Hintergrundfarbe*/
border-style: solid; /*Rahmen bestimmen*/
border-color: 87CEFF; /*Rahmen Farbe Überschrift*/
border-top-width: 0.05cm; /*Rahmenbreite oben*/
border-bottom-width: 0.05cm; /*Rahmenbreite unten*/
border-left-width: 0.05cm; /*Rahmenbreite links*/
border-right-width: 0.05cm; /*Rahmenbreite rechts*/
padding: 0em 0em 0em 1em; /*Abstände Überschrift */
position:relative; top:140px; left:300px; /*Position*/
margin-top: -20px; /*Abstand nach oben */
}

/*Fenster Thema Mitte ENDE*/

Ja danke, habe die cm Werte durch em erstetzt, danke

Hallo Foster, ja muss mich mal näher mit den div Befehl befassen, bekommen den und den class usw einfach net genau hin, weiß nicht wo mein Denkfehler liegt. Danke für deine Arbeit oben.

Gruss Detlef