Antworten auf deine Fragen:
Neues Thema erstellen

Grafik wird in <div> nicht angezeigt (IE)

T

thowe

Guest

Schönen gutenMorgen und tollen Wochenstart.

ich habe folgenden Seitenaufbau (ab <body>)

Code:
[COLOR=#000080]<body>[/COLOR]
[COLOR=#000080]<div id=[COLOR=#0000ff]"seite"[/COLOR]>[/COLOR]
  [COLOR=#000080]<div id=[COLOR=#0000ff]"kopf"[/COLOR]>[/COLOR]
    [COLOR=#000080]<div id=[COLOR=#0000ff]"logo"[/COLOR]>[/COLOR][COLOR=#000080]</div>[/COLOR]
  [COLOR=#000080]</div>[/COLOR]
  [COLOR=#000080]<div id=[COLOR=#0000ff]"hauptteil"[/COLOR]>[/COLOR]
    [COLOR=#000080]<div id=[COLOR=#0000ff]"links"[/COLOR]>[/COLOR]Raum für den Inhalt von  id "links"[COLOR=#000080]</div>[/COLOR]
    [COLOR=#000080]<div id=[COLOR=#0000ff]"inhalt"[/COLOR]>[/COLOR]Raum für den Inhalt von  id "inhalt"[COLOR=#000080]</div>[/COLOR]
    [COLOR=#000080]<div id=[COLOR=#0000ff]"rechts"[/COLOR]>[/COLOR]Raum für den Inhalt von  id "rechts"[COLOR=#000080]</div>[/COLOR]
    [COLOR=#000080]<hr />[/COLOR]
  [COLOR=#000080]</div>[/COLOR]
[COLOR=#000080]</div>[/COLOR]
[COLOR=#000080]</body>[/COLOR]
sowie folgendes stylesheet:

HTML:
* {
   margin: 0;
   padding: 0;
}
html, body {
    height: 100%;
}
body {
    font: 100%/1.4 Verdana, sans-serif;
    background-color:#fff;

}
h2, h3, p {
    margin-bottom: 1em;
}
#seite {
    margin-top: 2%;
    min-height: 100%;
    background-color:#005b94;

}
#kopf {
    text-align:center;
    background:url(../images/bg.gif);
    height: 156px;}
#logo {
    width: 864px;
    height: 138px;
    text-align:center;
    background:url(../images/headerdruck-bg.gif);
       /* ab hier zentrieren */

    position:absolute;
       left: 50%;
       margin-left: -432px;    
}
#hauptteil {
    background-color:#D4DFFF;
}
#links, #rechts, {
    font-size: 80%;
    width: 20%;
}
#inhalt {
    width: 59%;
    margin-left: 1%;
}
#links, #inhalt {
    float:left;
}
#rechts {
    float: right;
}
/* Trennlinie als unsichtbares Clear umschließt die Floats */
hr {
    clear:both;
    visibility:hidden;
}

NUN zum - erstaunlichen Problem:


Die Grafik in der Box "logo" (= ../images/headerdruck-bg.gif) wird nicht im Internetexplorer 8.0 angezeigt, auch nicht im Kompatibilitätsmodus. Das verstehe ich nicht. woran kann das liegen? die url Adresse muss stimmen, sonst würde mir das in DW und den anderen Browsern (Firefox 3.5 und Opera 10.0) nicht angzeigt werden.

Kann mir jemand helfen oder einen Tipp geben? Ich freue mcih über jeden Rat. >> Ich vermute, dass ich vielleicht mit z-index weiterkomme?

LG thowe
 

winne52

Webmaster

AW: Grafik wird in <div> nicht angezeigt (IE)

versuche es mal ohne dem -(Sonderzeichen)

images/headerdruck_bg.gif

schöne Woche
winne52
 

MyBad

localhorst

AW: Grafik wird in <div> nicht angezeigt (IE)

Hallo!

Hat das einen Grund, dass #logo absolut positioniert ist? Denn um es zu zentrieren würde ich darauf verzichten und es mit margin: 0 auto; zentrieren.

Das die Grafik nicht angezeigt wird, liegt im IE meist daran, dass Umlaute vorhanden sind.

Gruß
Tim
 

Jormungand

VonAllemEtwas

AW: Grafik wird in <div> nicht angezeigt (IE)

Hm, ist jetzt mal nur geraten, aber du kannst mal versuchen dem Logocontainer nen z-index mitzugeben.
IE stellt mich auch immer vor Rätsel und ich versuchs durch Trial und Error... :p
 
T

thowe

Guest

AW: Grafik wird in <div> nicht angezeigt (IE)

*wow* danke für die vielen Antworten >> da geht die Post ab...

Ich denke mir das "Übel" wird mit

HTML:
position: absolute
augelöst.

Ich versuche nun den Weg über

HTML:
margin: 0 auto
und melde mich, ob es funktionert :)

bis dahin cioa
 
T

thowe

Guest

AW: Grafik wird in <div> nicht angezeigt (IE)

Ich stehe vor einem absoluten Rätsel, Alle gängigen Browser zeigen es an, wie es sein soll. NUR NICHT DER IE! *grml* Ich verstehe es nicht.

So ich stelle nun die beiden Grafiken zur Verfügung.

bg.gif:






logo.gif (umbenannt, vorher: headerdruck_bg.gif)






nun der html-code!

HTML:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<link href="css/basis.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="seite">
  <div id="kopf">
    <div id="logo"></div>
  </div>
  <div id="hauptteil">
    <div id="links">Raum für den Inhalt von  id "links"</div>
    <div id="inhalt">Raum für den Inhalt von  id "inhalt"</div>
    <div id="rechts">Raum für den Inhalt von  id "rechts"</div>
    <hr />
  </div>
</div>
</body>
</html>
und nun die css-Anweisungen:

HTML:
@charset "utf-8";
/* CSS Document */
* {
   margin: 0;
   padding: 0;
}
html, body {
    height: 100%;
}
body {
    font: 100%/1.4 Verdana, sans-serif;
    background-color:#fff;
}
h2, h3, p {
    margin-bottom: 1em;
}
#seite {
    margin-top: 2%;
    min-height: 100%;
    background-color:#005b94;

}
#kopf {
    text-align:center;
    background:url(../images/bg.gif);
    height: 156px;
    z-index: 1;
    }
    
#logo {
    width: 864px;
    height: 138px;
    text-align:center;
    background-image:url(../images/logo.gif);
    margin: 0 auto;
    z-index: 2;
}
#hauptteil {
    background-color:#D4DFFF;
}
#links, #rechts, {
    font-size: 80%;
    width: 20%;
}
#inhalt {
    width: 59%;
    margin-left: 1%;
}
#links, #inhalt {
    float:left;
}
#rechts {
    float: right;
}
/* Trennlinie als unsichtbares Clear umschließt die Floats */
hr {
    clear:both;
    visibility:hidden;
}
Ich weiß viel Text.

ABER ich benötige wirklich eine Unterstützung, da ich schon vor einem Rätsel stehe. Also bitte, bitte.....

ciao :)
 

MyBad

localhorst

AW: Grafik wird in <div> nicht angezeigt (IE)

Den z-index bei #kopf und #logo kannst du dir sparen.
Warum die Grafik allerdings immer noch nicht angezeigt wird kann ich mir nicht so wirklich erklären. Hast du mal gegooglet, ob der IE 8 irgendwelche Probleme bei der Darstellung von Bildern hat?

Eins fällt mir noch ein auch, wenn es bei gif eigentlich nicht geht!?:
- Hast du bei dem Bild eventuell CMYK eingestellt? Oder 300 dpi?
 
Zuletzt bearbeitet:
AW: Grafik wird in <div> nicht angezeigt (IE)

margin:auto wird nicht gehen !!!

der ie 6 wurde ohne diesen schönen befehl erstellt bzw vor der zeit des css 1.2 glaub war des.

du musst daher versuchen entweder absolute pixel angaben zu machen , oder du lässt das div selber mit align center zentrieren bzw setzen.

sonderzeichen gehen schon , aber nur bedingt in solchen sachen.
ein weiteres prob wird es , wenn du in einen link auf das div machen willst .

sprich <a href="#" ><div id...></div></a> denn auch da hat der ie wieder schöne probs.
 

MyBad

localhorst

AW: Grafik wird in <div> nicht angezeigt (IE)

margin:auto wird nicht gehen !!!

der ie 6 wurde ohne diesen schönen befehl erstellt bzw vor der zeit des css 1.2 glaub war des.

du musst daher versuchen entweder absolute pixel angaben zu machen , oder du lässt das div selber mit align center zentrieren bzw setzen.

sonderzeichen gehen schon , aber nur bedingt in solchen sachen.
ein weiteres prob wird es , wenn du in einen link auf das div machen willst .

sprich <a href="#" ><div id...></div></a> denn auch da hat der ie wieder schöne probs.

Es geht um den IE 8 nicht 6! Und der IE 6 unterstützt sehr wohl auch margin: auto; Allerdings muss die Seite dazu 100% valide sein!
 

Tattoomaus78

nemesis-artgroup.de

AW: Grafik wird in <div> nicht angezeigt (IE)

liegen die Grafiken tatsächlich in einem übergeordnet Ordern auf dem Server? wenn nein, dann lösche mal ../

weiterhin hast du die Grafik logo.gif hier als .jpg hochgeladen....Absicht? oder ist es im code ein Tippfehler und müsste es logo.jpg heißen?

bei mir läufts im IE8
(Grafiken liegen auf einer Ebene mit der index.html im Ordner images ->also in css ohne "../")
 
T

thowe

Guest

AW: Grafik wird in <div> nicht angezeigt (IE)

hallo,

also zuerst an EUCH ALLE *Wow&dongge* >> bin wirlich überascht wie ihr an die Sache rangeht. Ich bin in einigen Foren tätig, komme von einer ganz anderen Programmierecke und muß nun aufgrund unternehmensexpansion typo3 und css erlernen....

ABER so schnellen und tollen Support habe ich noch nie erlebt. Also wirklich ganz erhlich gemeintes großes DANKESCHÖN an euch.

Das Problem ist gelöst, es ist etwas triviales gewesen und hat nichts mit der Technik des Zentrierens (also unabhänig von css)zu tun. Die Grafikdatei war beschädigt!

Der Hinweis von von Tattomaus78 das ich eine .jpg Dateil hochgeladen hatte, hat bei mir meine Ohrenklingeln lassen. Nachdem ich die Datei testete stellte ich fest, sie ist kaputt. So zum Glück gibt es Backup Dateien...

Danke auch für den Hinweis betreffend IE 6, werde nun eine eigene css-HACK Anordnung für IE schreiben. Wenn ich alles richtig verstanden habe, verursacht die proprietäre HasLayout Eigenschaft des IE`s einige Probleme. In meinem Fall wird wohl min-height nicht erkannt werden, und beim "zoomen" wird wohl auch die Grafik als Hintergrundbild vergrößert werden. Werde ich das wohl für html als auch für body in einen IE-Hack schreiben müssen.

NUN das wichtigste. Die Grafik wird auch im IE angezeigt, *wow*
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.640
Beiträge
1.538.506
Mitglieder
67.559
Neuestes Mitglied
mic4mac
Oben