Probleme mit IE6

Status
Nicht offen für weitere Antworten.
M

muepe

Grünschnabel
Hallo

Ich bastele schon seit einiger Zeit an einem neuen Layout für mein Weblog. Mittlerweile weiss ich auch schon, wie es aussehen soll. Die Anzeige in Firefox (JPG, 74KB) funktioniert bereits einwandfrei.
Allerdings habe ich noch schwere Probleme der Anpassung auf IE (JPG, 71KB)
Kann mir vielleicht jemand den entscheidenden Hinweis geben? ich bin mit meinem Latein am Ende...

CSS-Datei

Gruß, muepe
 
Hallo!

Das ist leider echt sehr schlecht zu erkennen, was da genau nicht Deinem "Gusto" entspricht. Das was mir auf die "Ferne" auffällt, die Abstände beim Datum und knapp drüber sind Ursache von margin bzw padding. Setze diese Werte mal auf 0.

Und beschreib doch mal im Einzelnen, wo es klemmt, oder stell die Seite online, zum anschauen. :)

Gruss Bud

Edit: Das mit der Strasse bzw den Streifen liegt an der Höhe des Elements, bzw der Wiederholung der Hintergrundgrafik. Ohne HTML und CSS kann ich aber nicht sagen, wie man das in Deinem Fall behebt.
 
Zuletzt bearbeitet:
Hi Bud,

das mit der Strassengrafik ist tatsächlich mein grösstes Problem.
Die Seite kann ich leider nicht online stellen, da mein Nucleus nur ein Stylesheet auf einmal verarbeiten kann und ich die Seite nicht online stellen möchte, solange sie noch nicht richtig läuft.

Das HTML ist, in Auszügen, das Folgende:

<body>

<div id="around">

<!-- definition of the logo -->
<div id="title">
<img src="<%skinfile(Logo_ohne_text_o.jpg)%>" width="760" height="222" border="0" alt="logo_oben" />
</div><!-- end of logo div -->
<div id="title2">
<div class="suche"><%searchform%></div>
<p class="quermenu"><a href="index.php?itemid=13">Impressum</a> | <a href="index.php?memberid=1">Kontakt</a> | <a href="<%archivelink%>">Archiv</a> | <a href="<%adminurl%>">Admin</a></p>

</div>

[...]

Das CSS hatte ich bereits verlinkt.

Das mit den Abständen kann ich, sollte das Grafik-Problem erst einmal gelöst sein, immer noch austüfteln. Soweit ich das richtig verstanden habe, ist margin aussenabstand und Padding der Innenabstand, oder?

Vielen Dank schonmal für die schnelle Antwort,
Gruß, muepe
 
Hallo!

Ich hab da jetzt mal ein bisschen rumprobiert, mit folgendem Ergebnis:

Meiner Ansicht nach hat das schon mit margin bzw padding zu tun. Du hast doch bei dem <div id="title2"> einen negativen margin. Probier doch mal, den einfach abzustellen und das ganze absolut zu positionieren (also mit "top" und "left").

Ich kann's leider nicht prüfen, da ich das Bild ja nicht hab.

Es wäre doch eine evtl. hilfreich, das mal im ganzen betrachten zu können. Vielleicht ein kostenloser Webspace bei Arcor? Ist ohne grosse Probleme zu registrieren, und funktioniert danach wunderbar. Dann könnte man nur die benötigten Bilder und Dateien hochspielne.. Aber das nur so als Vorschlag.

Wie gross ist denn das Bild mit den Streifen (760x22?) und das mit der Strasse (760x222?)?

Dann als Idee:
PHP: 
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#around {
	position:relative;
	margin:0px auto; /* 0px oben und unten, auto rechts und links) */
	width:760px;
	text-align:left;
}
#title {
	position:absolute;  /* Budman */
	top:0px; /* Budman */
	left:0px; /* Budman */
	height:222px;
	width:760px;
	padding:0px;
}
#title2 {
	top:222px; /* Budman */
	left:0px; /* Budman */
	height:22px;
	width:760px;
	padding:0px;
	background-image:url(Logo_ohne_text_u.jpg);
	position:absolute; /* Budman */
}
.quermenu {
	margin-left: 507px;
}
.quermenucontainer {
	width:100px;
	height: 20px;
	margin:10px;
}
a.quermenu:link, a.menu:visited { 
	color:#555;
	text-decoration:none;
}
a.quermenu:active, a.menu:hover { 
	color:#555;
	background-color:#EBB845;
}
#suche { /* Budman */
	margin-left: 7px;
	float: left;
}
A 			{ color: #555; text-decoration: none; font-weight:bold; } 
A:link		{ color: #555; text-decoration: none; } 
A:visited	{ color: #555; text-decoration: none; } 
A:active	{ color: #EBB845;  } 
A:hover		{ color: #EBB845;}
body {
    font-family: Verdana, Sans-Serif;
    font-size: 11px;
    color: black;
	background-attachment: fixed; 
	background-image: url(background.jpg);
	background-repeat: repeat-x;
    margin-top: 8px;
    line-height: 15px;
	text-align:center; /* greift zusammen mit margin:0px auto */
}
</style>
</head>

<body>
<div id="around">
	<div id="title">
		<img src="<%skinfile(Logo_ohne_text_o.jpg)%>" width="760" height="222" border="0" alt="logo_oben" />
	</div>
	<div id="title2">
		<div id="suche"><%searchform%></div>
		<p class="quermenu"><a href="index.php?itemid=13">Impressum</a> | <a href="index.php?memberid=1">Kontakt</a> | <a href="<%archivelink%>">Archiv</a> | <a href="<%adminurl%>">Admin</a></p>
	</div>
</div>
</body>
</html>

Das lässt sich jetzt ja noch verfeinern... :) Ich hab meine Änderungen mit Budman gekennzeichnet, zur besseren Übersicht :)

Gruss Bud
 
Hi Bud,

hat ein bißchen gedauert aber jetzt habe ich das Problem glöst.
Ich habe einfach
Code: 
* {
padding:0;
margin:0;
}
in mein Stylesheet eingefügt und damit waren alle Abstände gleichermaßen auf Null. Die wietere Anpassung war dann nicht mehr schwer.

Danke für Deine Hilfe,
muepe
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück