zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Darstellungsunterschiede IE6 /IE7 /FF3

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.12.2008, 13:26
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.12.2008
Beiträge: 1
littlenemo befindet sich auf einem aufstrebenden Ast
Standard Darstellungsunterschiede IE6 /IE7 /FF3

Guten Tag zusammen,

ich habe unter Kosmetik am Grillo *·* Mikrodermabrasion, Kosmetik, Massagen und Wellnessanwendungen in Essen eine Landingpage erstellt, die unter dem FF3 und dem IE7 so aussieht (abgesehen von -moz-border-radius-Angaben) wie ich sie haben will.
Im IE6 verschwinden die Texte vollständig, es bleiben nur die Fußzeile und der Header (CSS-ID mit hinterlegtem Hintergrundbild) sowie das dort eingebundene Menu vor silver-Hintergrund übrig.
Entwickelt wurde unter FF3 (reines HTML Schreiben, kein WYSIWIG-Editor, CSS mit TopStyleLite erstellt).

Ich habe bisher kein Erfahrung mit der Erstellung einer Browserweiche, daher benötige ich etwas Hilfestellung. Ich weiß noch nicht einmal ob "Floaten" das richtige Stichwort ist, daher sind mir die dort genannten Links auch keine Hilfe. Multiple IE ist vorhanden

Mein Bitte: Könnte sich bitte jemand den HTML-Quelltext (validiert!) und die CSS-Datei ansehen und mir die Hand führen?

Ich danke euch

Grob-Struktur der HMTL-Seite (Text 'rausgekillt)
HTML-Code:
<?xml version="1.0" encoding="us-ascii"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<link rel="stylesheet" type="text/css" href="css/csslpmain.css" />
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="Author" content="LittleNemo" />
<meta name="revisit-after" content="10 days" />
<meta name="robot" content="Index,Follow" />
<meta name="description" content="Kurzbeschreibung" />
<meta name="page-topic" content="Diverse Page Topics" />
<meta name="keywords" content="Diverse Stichworte/>
<title>Titleangaben</title>

</head>
<body>
<div style="margin: 0px auto; width: 800px; text-align: left;">

<div id="header"><!-- mit Bildhintergrund => CSS -->
<div id="menu"><!-- Menu im Header => CSS -->
Diverse Menu-Links
</div>
</div>

<div id="content"><!-- Weisser Hintergrund -->
<div class="left"><!-- Linke Spalte => CSS -->
<h2>Was ist Mikroabrasion?</h2>
Text
Bild mit style="float:right;"
<ul>Listeneinträge</ul>
<h2>Überschrift</h2>
Text
</div>

<div class="right"><!-- Rechte Spalte => CSS -->

<h2>Überschrift</h2>
Text und Bild mit style="float:left;padding:5px;"
Bild Link mit style="float:right;"
<h2>Überschrift</h2>
Text mit Bild-Link
</div>
</div>


<div id="footer"><!-- Seitenfuss => CSS -->Adressangabe
</div>
</div>

</body>
</html>

Der CSS-Code ist hier:
Code:
body{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: Silver; /*#fced9a;*/
	text-align: left; /*Scrollbaranzeige nur IE*/
	scrollbar-arrow-color: #ab2641;
	scrollbar-face-color: #fced9a;
	scrollbar-3dlight-color: #ab2641;
	scrollbar-base-color: #fced9a;
	scrollbar-track-color: #fced9a;
}
h2 {font-size:14px;
	color:#ab2641;
	}

p {margin-top:0px;}

a:link, a:visited, a:active, a:hover
{
  text-decoration:none;
  font-weight:bold;
  color:#ff9200;
}

a:active, a:hover
{
  color:#ffffff;
}

a.menu:link, a.menu:visited, a.menu:hover
{
  color:#ab2641;
  display: inline;
  margin-top: 2px;
  text-align: center;
  width: 100px;
  padding: 5px;
  font-size:10px;
}
a.menu:active, a.menu:hover
{
  color:#eeeeee;
  display: inline;
  margin-top: 2px;
  text-align: center;
  width: 100px;
  padding: 5px;
  background-color: #ab2641;
  font-size:10px;
}

/* Die Titelzeile */
#title {
	padding-top:15px;
	height:24px;
	color: #214778;
}

/* Das Menü */
#menu {
	color: #ab2641;
	text-align: right;
	padding: 0px 0px;
}

/* Der Inhalt */
#content {
	position: absolute;
	top: 200px;
	width: 800px;
	margin: 0px auto;
	background-color: white;/*#fced9a; 
	padding: 5px;*/
	color: #214778;
	text-align: left;
	overflow: auto;
	bottom: 0px;

	z-index:0;
	/*Eckenradius in Pixel, nicht IE*/
	-moz-border-radius-topright:10px;
	-moz-border-radius-topleft:10px;
	-khtml-border-radius-topright:10px;
	-khtml-border-radius-topleft:10px;
}
small{
	width: 760px;
	font-size: xx-small;
	text-align: center
}

#footer{
	position: absolute;
	bottom: 0;
	width: 800px;
	height: 15px;
/*	overflow: auto;*/
	text-align: left;
	background: #ab2641;
	color: #eeeeee;
}
#header{
	position: absolute;
	top: 0px;
	width: 800px;
	height: 200px; /*	overflow: auto;*/
	text-align: left;
	background-color: white;
	background-image: url(../img/aesthetik5.png);
	background-repeat: no-repeat;
	background-position: bottom;
}

.arrow{
	padding-left: 40px;
}

.left{
	position: absolute;
	top: 0px;
	padding: 5px;
	width: 450px;
	/*overflow: auto;*/
	/*border: solid;
	border-color: red;*/
}
.right{
	position: absolute;
	top: 5px;
	margin-left: 465px;
	padding: 0px;
	width: 335px;
	z-index: 5;
	/*border: solid;
	border-color: Aqua;*/
}
#star24{
	position: absolute;
	top: 250px;
	margin-left: 5px;
	padding: 5px;
	width: 220px;
	z-index: 99;
/*	border: solid;
	border-color: Aqua;*/
}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.12.2008, 23:42
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.037
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Schon mal versucht, den Containern in #content eine Höhe zu geben?
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
IE6 Problem - Menü zumindest bedienbar machen Ares CSS 1 11.02.2011 13:33
IE6 "cleart" Spalte ohne ersichtlichen Grund ppatrick CSS 5 05.04.2010 15:50
IE6 ignoriert CSS-Anweisungen Hallenkicker CSS 11 27.07.2008 21:58
Text-Zeichen im IE6 wiederholen sich – Problem... rg69 (X)HTML 2 05.06.2008 15:36
Dropdown-menü ie6 Darstellungsprobleme Koody CSS 6 29.08.2007 15:15


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:29 Uhr.