Auslagen der CSS Datei, Hintergrund im Kopfbereich verschwindet?

[AxelFoley]

Hi,

habe folgendes CSS-Script mal aus meinem HTML Script in die eine separate .css datei gespeichet und die Verlinkung in der HTML Datei angegeben.
Im Browser sieht auch alles super wie bisher aus, allerdings fehlt mir der rote Kopfbereich mit 150px, wird nicht korrekt übernommen? Script ist aber
doch korrekt oder?:

[css]
<style type="text/css">
<!--

#kopfbereich {
background-color:red;
height:150px;
}

#steuerung {
background-color: #5ca0ff;
padding-left:1em;
text-align:left;
}

#steuerung ul {
list-style:none;
}

#steurung li {
display: inline;
float: left;
width:90px;
background-color: #5ca0ff;
border-right:2px black solid;
}

#schatten {
background:url(bilder/schatten.png) repeat-x;
height:12px;
}

#inhalt {
background-color: orange;
padding-top:2em;
padding-right:2em;
padding-left:2em;
padding-bottom:2em;
}

html, body {
font: 100% Arial, Helvetica, sans-serif;
}
#kopfbereich p {
color:white;
text-align:center;
font-size:3em;
padding:0.4em 0.4em 0 0;
}

* {
margin:0;
padding:0;
}

#inhalt h1, h2, h3, p, ul {
padding-bottom:.7em;
}

#inhalt ul {
padding-left:2em;
}

-->
</style>
[/css]

Danke für Hilfe,

LG
Axel

 

[threadi]

Die externe CSS-Datei darf keine HTML-Attribut enthalten. Also weder <style> noch </style> noch die HTML-Kommentare.

Btw.: Wieso sind deine Quellcode immer alle fehlerhaft verlinkt? Verwende bitte Code-Tags wenn Du Quellcode im Forum zeigen willst.

 

[AxelFoley]

Super, danke. Habe eckige Klammer auf css eckige Klammer zu "Code" eckige Klammer auf /css eckige Klammer zu verwendet, war das der falsche?

Mit dem rot funktioniert es jetzt, mit einem Bild (habe es im gleichen Ordner wie die css und html Dateien im Unterordner "Bilder") leider noch nicht:

[css]
#kopfbereich {
background:url(bilder/P1060235.jpg) no repeat left top;
height:150px;
}
[/css]

Kann hier vlt. noch jmd. weiterhelfen?

Danke.

LG
Axel

 

[threadi]

Geh mal auf "Erweitert" wenn Du einen Beitrag schreibst. Dort im erweiterten Editor gibt es in der 2. Symbolleiste rechts 3 Buttons. Den 3. von rechts würde ich für CSS verwenden. Also statt "css" -> "code".

Wenn Du ein Bild so in einer externen Datei referenzierst:

url(bilder/P1060235.jpg)

muss das Bild ausgehend von dem Standort der CSS-Datei im Unterverzeichnis bilder stehen. Wohl gemerkt: "bilder" klein geschrieben. Wenn Du das Verzeichnis groß geschrieben hast, passt es natürlich nicht und er findet das Bild nicht.

 

[Nialma]

kenn nun deine Struktur der Webseite nicht aber gehen wir mal davon aus, dass die Bilder in /bilder und die css auf der ebene der index liegt dann muss das in der css so aussehen:

background: url(./bilder/bildname) no-repeat left top;

geht aber im angenommenen Fall auch

background: url(/bilder/bildname) no-repeat left top;

 

[AxelFoley]

Hi funktioniert leider immer noch nicht, Verzeichnis heißt korrekt bilder (klein geschrieben)

    #kopfbereich {
        background: url (./bilder/P1060235.JPG) no-repeat left top;
                   height:150px;
        }

die höhe wird korrekt skaliert, allerdings in weiß ohne mein Bild...

 

[AxelFoley]

nehme ich statt das Bild background-color:red; wird mir alles korrekt in rot und der richtigen Höhe angezeigt

 

[threadi]

Dann hast Du immernoch irgendwas an der Bildreferenzierung falsch gemacht. Die üblichen Tipps wurden dir bereits gegeben. Wenn Du es nicht findest wäre für uns nur noch ein Link zur Seite hilfreich.

 

[AxelFoley]

Fehler gefunden. Dummer Tippfehler im Code :roll: Trotzdem danke für die hilfreichen Antworten!!!