✔ div problem

Status
Nicht offen für weitere Antworten.
das_element

das_element

Erfahrenes Mitglied
hey,
ich habn Problem mit den div-tags.
Ich hab in einem externen *.css-File folgendes festgelegt:
Code: 
.headerdiv {
margin-top: -8px;
}

.contentdiv {
margin: 10px;
}

In die Seite habe ich die div-Tags eingebunden.
Jetzt hebt sich aber das margin des .contentdivs mit dem margin des headerdvis auf.
Das heißt ich hab nur einen Abstand von 2!
Ich habe aber eigentlich zwei verschiedene Bereiche definiert?
Trotzdem werden die margins auf die gesamte Seite angewendet?

Kann mit jemand das erklären, oder evtl. meinen Fehler sagen?

mfg
Stefan
 
Ich kann das vermeintliche Problem nicht entdecken.
  • Browsercheck: FF 1.0.7, IE 6.0, MOZ 1.6, NN 7.0, OP 8.50

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title></title>

<style type="text/css">
<!--
body
{
margin: 0;
padding: 0;
}

.headerdiv {
margin-top: -8px;
border: 1px solid #000;
}

.contentdiv {
margin: 10px;
border: 1px solid #000;
}
-->
</style>

</head>
<body>

<div class="headerdiv">headerDiv</div>

<div class="contentdiv">contentDiv</div>

</body>
</html>
Oder hast du die DIVs in dieser Reihenfolge notiert? :suspekt:

HTML: 
<div class="contentdiv">contentDiv</div>

<div class="headerdiv">headerDiv</div>
 
hoi,
Ich hab probiert, das Stylesheet direkt in die Datei zu schreiben, wie unten gezeigt, hat aber auch nichts gebracht :(
Ich hab den Firefox 1.0.6 aber der interpretiert div's doch? - Also denke ich, an dem liegts nicht...
Ja, ich habe die richtige Reihenfolge eingehalten.

Hoffentlich gibts noch weitere Lösungsvorschläge
 
Bei mir ist im FF +IE auch kein Fehler zu entdecken.
~~~

Wenn man viel mit margin-Werten arbeitet, muss man nur auf folgende Eigenheit achten.

<div style="margin-bottom: 5px "></div>
<div style="margin-top: 6px"></div>

Nun sollte man meinen, dass die beiden margin Werte addiert werden, also die beiden div Blöcke ein Abstand von 11px haben.
Aber man erhält nur 6px Abstand.
-> es wird immer der größere Wert von beiden genommen und damit das Layout erstellt.

Ist nur ne Anmerkung - hilft dir bei deinem "Problem" aber auch nicht weiter, wobei ich keinen Darstellungsfehler erkennen kann. :confused:

Kannst du evtl. ein Screenshot zeigen?
 
der quelltext lautet:

Code: 
<html>
<head>
<title>Site-Page</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body bgcolor="#898989">
<center>

<table cellpadding="0" cellspacing="0" width="650px" border="0" bgcolor="#999999">
	<div class="headerdiv">
<tr>
<td>
<center>
<img src="bg_layer.bmp">
<img src="buttons.bmp">
</center>
</td>
</tr>
	</div>
	<div class="contentdiv">
<tr>
<td>
Textinhalt<br>
blalalalalalalalal<br>
</td>
</tr>
	</div>


</table>
</center>

</body>
</html>


Außerdem möchte ich auf meinen anderen Thread im HARDWARE-Forum verweißen.
http://www.tutorials.de/forum/showthread.php?p=1191486
 
Bei diesem fehlerhaften HTML-Quelltext ist es auch kein Wunder, daß es bei dir Darstellungsprobleme gibt :suspekt:

Denn zwischen <table> ... <tr>, sowie </tr> ... <tr> und </tr> ... </table> werden keine HTML-Elemente notiert / eingebaut, sondern nur innerhalb des <td> -Elements (!)

[ editpost ]

Empfehle dir das Kapitel Aufbau einer Tabelle @ SELFHTML.
 
Zuletzt bearbeitet von einem Moderator:
Es gibt schon Elementdeklarationen, die dort notiert werden dürfen – allerdings sind das keine div-Elemente.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück