tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
8
ZUGRIFFE
689
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 13.09.05 15:19 #1
    LordSikon LordSikon ist offline Mitglied Silber
    Registriert seit
    Nov 2003
    Beiträge
    67
    Hi

    eine homepage mit div containern soll an einer stelle ein hintergundbild anzeigen. nach w3c ist der xhtml und css code valid, aber trotzdem zeigt er mir das bild nicht an, wieso?
    Ordnerstruktur und alles stimmt, die datein sind auch da!

    XHTML Code einer Seite

    HTML-Code:
    <!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>
    <title>
     tolle seite
    </title>
    <link rel="stylesheet" type="text/css" href="style/container1.css" />
    <link rel="stylesheet" type="text/css" href="style/global.css" />
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <style type="text/css">
    /*<![CDATA[*/
 span.c2 {float:right}
 span.c1 {float:left}
    /*]]>*/
    </style>
  </head>
  <body>
    <!-- Head Start -->
    <div id="head">
      <div id="logo">
        <a href="main.html" title="Startseite"><img
        src="images/page/logo.gif" alt="Start" /></a>
      </div>
      <div id="quicklinks">
        <a href="main.html" title="Aktuelle News">| News</a>&nbsp;&nbsp;&nbsp; <a
        href="main3.html" title="Zu unserem Diskussionsforum">|
        Forum</a>&nbsp;&nbsp;&nbsp; <a href="suche.html" title="Suchfunktion">|
        Suche</a>&nbsp;&nbsp;&nbsp; <a href="rechtliches.html"
        title="Rechtliche Hinweise">| Rechtliches</a>&nbsp;&nbsp;&nbsp; <a
        href="main4.html" title="Zu unserem Impressum">| Impressum</a>&nbsp;&nbsp;&nbsp;
        <a href="main.html" title="Deutsche Sprachversion">| DE</a>&nbsp;&nbsp;&nbsp; <a
        href="main_eng.html" title="English version">| ENG</a>&nbsp;&nbsp;&nbsp;
      </div>
    </div>
    <!-- Head End -->
    <!-- Headimage Start -->
    <div id="headimage">
      &nbsp;
    </div>
    <!-- Headimage End -->
    <!-- Kategorienavigation Start -->
    <div id="mainnavigation">
      <a href="main.html" title="Aktuelles">
      <object id="aktuelles1">
        Aktuelles
      </object></a>
      &nbsp; <a href="main2.html" title="Unsere Produkte">
      <object id="produkte0">
        Produkte
      </object></a>
      &nbsp; <a href="main3.html" title="Zu unserem Diskussionsforum">
      <object id="forum0">
        Forum
      </object></a>
      &nbsp; <a href="main4.html" title="Servicefunktionen der Webseite">
      <object id="service0">
        Service
      </object></a>
    </div>
    <!-- Kategorienavigation End -->
    <!-- Navigation Start -->
    <div id="navigation">
      <table cellspacing="0" cellpadding="0">
        <tr>
          <td class="arrow1">
            &nbsp;
          </td>
          <td class="text1">
            <a href="main.html" title="Aktuelles">Aktuelles</a>
          </td>
        </tr>
        <tr>
          <td class="arrow01">
            &nbsp;
          </td>
          <td class="text01">
            <a href="main.html" title="2005">2005</a>
          </td>
        </tr>
        <tr>
          <td class="arrow00">
            &nbsp;
          </td>
          <td class="text00">
            <a href="jobs.html" title="Jobangebote">Jobangebote</a>
          </td>
        </tr>
        <tr>
          <td class="arrow0">
            &nbsp;
          </td>
          <td class="text0">
            <a href="presse.html" title="Presseberichte">Presse</a>
          </td>
        </tr>
      </table>
    </div>
    <!-- Navigation End -->
    <!-- Content Start -->
    <div id="content">
     Content
    </div>
    <!-- Content End -->
  </body>
</html>
    PHP ist noch nicht fertig, aber egal.


    Und hier der CSS Code dazu:
    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245

    #head { 
position:absolute;
top:0px;
left:0px;
width:100%;
height:70px;
border:1px;
border-color:#DAD7D7;
border-style:solid;
background-color:#DAD7D7;
background-image: url(../images/page/bg_head.gif);
font-family:Verdana,Arial,sans-serif;
font-size:10px;
}
 
#quicklinks {
position:absolute;
right:0px;
top:0px;
height:15px;
background-image: url(../images/page/bg_quicklinks.gif);
}
 
#headimage { 
position:absolute;
top:71px;
left:0;
width:100%;
height:150px;
border:1px;
border-color:#DAD7D7;
border-style:solid;
background-color:#DAD7D7;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
background-image: url(../images/page/bg_headimage.gif);
}
 
#headimage01 { 
position:absolute;
top:0px;
left:0;
width:400px;
height:150px;
border:0px;
background-color:#DAD7D7;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
background-image: url(../images/page/headimage1.gif);
}
 
#mainnavigation { 
position:absolute;
top:222px;
left:0;
width:100%;
height:25px;
border:1px;
border-color:#DAD7D7;
border-style:solid;
background-color:#DAD7D7;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
 
}
 
#aktuelles1 { 
position:absolute;
top:0px;
left:200px;
width:100px;
height:15px;
background-color:#FFFFFF;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
color:#000000;
padding-top:3px;
padding-left:50px;
border-left:1px;
border-style:solid;
border-color:#DAD7D7;
}
 
#produkte0 { 
position:absolute;
top:0px;
left:350px;
width:100px;
height:15px;
background-color:#000000;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
color:#FFFFFF;
padding-top:3px;
padding-left:50px;
border-left:1px;
border-style:solid;
border-color:#DAD7D7;
}
 
#forum0 { 
position:absolute;
top:0px;
left:500px;
width:100px;
height:15px;
background-color:#000000;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
color:#FFFFFF;
padding-top:3px;
padding-left:50px;
border-left:1px;
border-style:solid;
border-color:#DAD7D7;
}
 
#service0 { 
position:absolute;
top:0px;
left:650px;
width:100px;
height:15px;
background-color:#000000;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
color:#FFFFFF;
padding-top:3px;
padding-left:50px;
border-left:1px;
border-style:solid;
border-color:#DAD7D7;
}
 
 
#navigation { 
position:absolute;
top:249px;
left:0;
width:200px;
min-height:1000px;
border:1px;
border-color:#E5E5E5;
border-style:solid;
background-color:#E5E5E5;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
}
 
#content { 
position:absolute;
top:249px;
left:200px;
width:600px;
min-height:1000px;
background-color:#FFFFFF;
font-family:Verdana,Arial,sans-serif;
font-size:10px;
padding-top:5px;
padding-left:10px;
}
 
#content a:link {
color:#C32020;
text-decoration:none;
}
 
#content a:visited {
color:#C32020;
text-decoration:none;
}
 
#content a:hover {
color:#C32020;
text-decoration:underline;
}
 
#content a:active {
color:#C32020;
text-decoration:underline;
}
 
#quicklinks a:link {
color:#000000;
text-decoration:none;
}
 
#quicklinks a:visited {
color:#000000;
text-decoration:none;
}
 
#quicklinks a:hover {
color:#000000;
text-decoration:none;
}
 
#quicklinks a:active {
color:#000000;
text-decoration:none;
}
 
#mainnavigation a:link {
color:#000000;
text-decoration:none;
}
 
#mainnavigation a:visited {
color:#000000;
text-decoration:none;
}
 
#mainnavigation a:hover {
color:#000000;
text-decoration:none;
}
 
#mainnavigation a:active {
color:#000000;
text-decoration:none;
}
 
#navigation a:link {
color:#000000;
font-style:normal;
text-decoration:none;
}
 
#navigation a:visited {
color:#000000;
font-style:normal;
text-decoration:none;
}
 
#navigation a:hover {
color:#000000;
font-style:italic;
text-decoration:none;
}
 
#navigation a:active {
color:#000000;
font-style:italic;
text-decoration:none;
}

    Es gibt noch eine weitere CSS Datei, die sollte aber mit den Containern und so nichts zu tun haben.

    Grüße
     
  2. 13.09.05 17:59 #2
    Avatar von Gumbo
    Gumbo Gumbo ist offline
    Registriert seit
    Dec 2002
    Ort
    Trier
    Beiträge
    17.502
    Blog-Einträge
    10
    Sind die Grafik-Dateien ünerhaupt vorhanden und stimmt die Ressourcenangabe relativ vom Stylesheet gesehen?
     
    Markus Wulftange
  3. 13.09.05 19:47 #3
    LordSikon LordSikon ist offline Mitglied Silber
    Registriert seit
    Nov 2003
    Beiträge
    67
    Alles vorhanden, sowie datein als auch ordnerstruktur. Auch keine Rechtschreibfehler!
     
  4. 13.09.05 19:52 #4
    Maik Tutorials.de Gastzugang
    1. Welche der 4 Hintergrundgrafiken wird nicht angezeigt?

    2. Mit welchem Browser hast du die Seite getestet?

    3. Gibt es eine Online-Version zum Testen?

    4. Welche Selektoren und CSS-Eigenschaften sind in der anderen CSS-Datei notiert?
    Geändert von Maik (13.09.05 um 19:56 Uhr)
     
  5. 13.09.05 20:06 #5
    LordSikon LordSikon ist offline Mitglied Silber
    Registriert seit
    Nov 2003
    Beiträge
    67
    ALso hier die global.css

    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101

    body {
      margin:0px;
}
 
img {
border:0px;
}
 
.arrow1 {
background-image: url(../images/page/nav_pfeil_ganz.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
height:20px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
background-color:#828282;
}
 
.text1 {
width:185px;
height:20px;
font-size:10px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
padding-left:3px;
background-color:#828282;
}
 
.arrow01 {
background-image: url(../images/page/nav_pfeil_ganz.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
height:12px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
background-color:#A3A3A3;
}
 
.text01 {
width:170px;
height:12px;
font-size:10px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
padding-left:3px;
background-color:#A3A3A3;
padding-left:15px;
}
 
.arrow00 {
background-image: url(../images/page/nav_pfeil_halb.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
height:12px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
background-color:#D2D2D2;
}
 
.text00 {
width:170px;
height:12px;
font-size:10px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
padding-left:3px;
background-color:#D2D2D2;
padding-left:15px;
}
 
.arrow0 {
background-image: url(../images/page/nav_pfeil_halb.gif);
background-repeat:no-repeat;
background-position:center;
width:15px;
height:20px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
background-color:#BBBABA;
}
 
.text0 {
width:185px;
height:20px;
font-size:10px;
border:1px;
border-style:solid;
border-color:#FFFFFF;
padding-left:3px;
background-color:#BBBABA;
}


    Online demo:
    http://jbo-wolbrechtshausen.de/ae/main.html

    Getestet mit:
    - IE
    - FF

    An dem grau-rotem Balken hängt normalerweise noch ein Foto (headimage1.gif), das wird nich angezeigt.
    Geändert von LordSikon (13.09.05 um 20:11 Uhr)
     
  6. 13.09.05 20:17 #6
    Maik Tutorials.de Gastzugang
    In dem HTML-Source befindet sich ja auch kein DIV mit der ID #headimage01
     
  7. 13.09.05 20:39 #7
    LordSikon LordSikon ist offline Mitglied Silber
    Registriert seit
    Nov 2003
    Beiträge
    67
    Ok,
    die dümmsten fehler haben die einfachsten ursachen

    aber, er zeigt das bild nur an, wenn man noch auf aktualisieren klickt. muss ich evtl. mittels nem meta tag noch, sagen, dass er keinen cache verwenden soll oder was, sonst zeigt er da nur grau an und nach aktualisierung zeigt er erst das foto an, wieso das?
     
  8. 13.09.05 21:00 #8
    Maik Tutorials.de Gastzugang
    Bei mir zeigen die Browsers die Hintergrundgrafik direkt an.
     
  9. 14.09.05 20:09 #9
    LordSikon LordSikon ist offline Mitglied Silber
    Registriert seit
    Nov 2003
    Beiträge
    67
    naja, dann leigts wohl bei mir oder so.


    Danke!
     
« mouse over bei Firefox | Abstand zum Rand bei Dropdown »

Ähnliche Themen

  1. background-image wird nicht angezeigt
    Von Nerolein im Forum CSS
    Antworten: 16
    Letzter Beitrag: 21.05.10, 23:58
  2. Background Image <td> wird nicht angezeigt.
    Von Kopfballstar im Forum HTML & XHTML
    Antworten: 10
    Letzter Beitrag: 04.05.06, 21:07
  3. Background-Image, div mit css - wird nicht angezeigt
    Von pixel05 im Forum CSS
    Antworten: 3
    Letzter Beitrag: 29.10.05, 14:39
  4. firefox zeigt background-image nicht an
    Von d-braun im Forum HTML & XHTML
    Antworten: 2
    Letzter Beitrag: 12.10.05, 13:13
  5. background-image: fixed geht im IE nicht...
    Von metty im Forum CSS
    Antworten: 15
    Letzter Beitrag: 04.07.05, 21:13