[HTML] Abstand zwischen Divblöcken im IE7

Super Mario · 30. Juni 2007

Abstand zwischen Divblöcken im IE7

In Firefox und Opera funktioniert es so wie es soll die Divblöcke liegen direkt übereinander, aber beim IE eben nicht...
Es ist immer ein kleiner Abstand dazwischen.
Hier mal der Code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
<title>header</title>
<style type="text/css">@import url(design.css);</style>
</head>
<body>
<center>
<div id="design">
<div id="header">
<img src="images/header.jpg" width="916" height="249" alt="" />
</div>
<div id="topnavi">
Link Link Link Link Link Link Link Link Link Link Link Link 
</div>
<div>
<img src="images/tri2.jpg" width="916" height="8" alt="" />
</div>
<div id="box">
Header<br /><br /><br />
</div>
<div id="navi">
Inhalt 
<br />
<br />
<br />
<br />
<br />
<br />
</div>
<div id="trennlinie">
<img src="images/tri.jpg" width="735" height="8" alt="" />
</div>
<div id="content">
Inhalt<br /><br /><br />
</div>
</div>
</center>
</body>
</html>

CSS:

Code:

body {
background-color: #8dc032;
background-image: url(images/bg.jpg);
background-position: top;
background-repeat: repeat-x;
margin-top: 0px;
}
#design {
width: 916px;
}
#topnavi {
width: 916px;
height: 25px;
background-image: url("images/topnavi.jpg");
}
#trennlinie {
float: left;
}
#box{
position: relative;
float: left;
top: 0px;
left: 0px;
width: 735px;
height: 106px;
background-image: url("images/box.jpg");
}
#content{
position: relative;
float: left;
top: 0px;
left: 0px;
width: 735px;
background-image: url("images/content.jpg");
} 
#navi{
position: relative;
float: right;
top: 0px;
left: 0px;
width: 181px;
background-image: url("images/navi.jpg");
}

Anzeige

MakenX · 30. Juni 2007

AW: Abstand zwischen Divblöcken im IE7

Bei sowas, oder besser bei diesem Bug, immer den Whitespace im Html - Code zwischen den betroffenen Elementen entfernen! Wegen diesem Rotzbug arbeite ich bei meinen Templates immer mit der Smarty-Funktion strip!

EDIT: Aber wenn du doch schon mit CSS arbeitest, wozu soviele brs? So viele Divs ... allgemein so viel Overhead? Da kannste noch viel reduzieren und umso weniger stoff umsoweniger Fehler!

Super Mario · 30. Juni 2007

AW: Abstand zwischen Divblöcken im IE7

Kenn mich nicht so gut aus mit dem coden ^^
Das Design ist so aufgebaut:

http://img.fotoupload.org/img1/e894586fd43489d3a796f14053390f25.jpg

Für jeden bereich ein Divblock und das ganze nochmal in einem Div um es richtig auszurichtchten und das die Divs richtig aneinander liegen.

Die vielen brs sind da weil das mit der Höhe=100% nicht so klappt wie ich mirs voststelle.
Das Design soll nach unten hin unendlich lang sein.
Im Div das das Design umschließt ist eine Hintergrundgrafik drinnen

Ich kann den BG auch im body machen, aber ich brauche 2 Hintergrundgrafiken oO
Die eine soll oben sein (y Achse)
die andere in der Mitte zentriert (x Achse)

MakenX · 30. Juni 2007

AW: Abstand zwischen Divblöcken im IE7

Und was ist jetzt mit deinem eigentlichen Problem? Wurde es gelöst oder nicht!? Die restlichen Fragen lassen sich mit selfhtml beantworten, ein Tipp, wenn du die höhe bestimmen willst müssen die relativen Elemente im selben Textfluss sein, also ein gefloatetes element beinflusst kein "statisches" element und ein inline element nimmt nicht direkt eine höhe an!

Super Mario · 1. Juli 2007

AW: Abstand zwischen Divblöcken im IE7

Das Problem ist noch nicht gelöst hab immer noch die Abstände

Murdoc · 1. Juli 2007

AW: Abstand zwischen Divblöcken im IE7

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>header</title>
<style type="text/css">
body {
background-color: #8dc032;
background-image: url(images/bg.jpg);
background-position: top;
background-repeat: repeat-x;
margin-top: 0px;
text-align: center:
}

.main {
margin: auto;
width: 900px;
background-color: #00008b;
}

.header {
height: 200px;
background-color: #000000;
}

.content {
/**/
}

.topc {
background-color: #8b0000;
height: 100px;
float:left;
width: 750px;
}

.right {
width: 150px;
float: right;
}

.text {
background-color: #556B2F;
float: left;
height: 500px;
width: 750px;
}
</style>
</head>
<body>
<div class="main">
 <div class="header">
 Header;;
 </div>
 <div class="content">
 <div class="right">
 right;;
 </div>
 <div class="topc">
 top;;
 </div>
 <div class="text">
 text;;
 </div>
 </div>
 <div style="clear:both;"></div>
</div>
</body>
</html>

Super Mario · 1. Juli 2007

AW: Abstand zwischen Divblöcken im IE7

Super es klappt danke Murdoc-4D

Nützliche Suchen

[HTML] Abstand zwischen Divblöcken im IE7

Videos zum Themenbereich