Headergrafik passt nicht

vs-intruder

Ich habe nach Anleitung von Wordpress die Grafik "Kubrick.jpg" gegen eine eigene Grafik mit der gleichen Pixelgröße ausgetauscht.
Nun ist die Grafik trotzdem viel zu groß und passt sich nicht, wie die blaue originale Kubrickgrafik ins Design an.
Wenn ich nun die Grafikgröße mit Photoshop verkleinere, so ist zwar die Grafik an sich kleiner, aber die Headergrafik steht immer noch über.
Wäre toll, wenn mir jemand helfen könnte.
http://www.boa-constrictor.info/blog

sorry, bin leider auch Einsteiger und versuche irgendwie zurechtzukommen.
Zumindest habe ich mit Tipps aus diesem Forum (Suchfunktion) schon geschafft, daß ein Klick auf die Grafik zur Startseite zurückführt ;-)

Gruß
Frank

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

SuMu

hier mit wird deine Grafik formatiert:

HTML

#headerimg     { 
    margin: 7px 9px 0; 
    height: 192px; 
    width: 740px; 
    }

und noch mal eine Angabe dazu:

HTML

#headerimg {
    margin: 0;
    height: 200px;
    width: 100%;
    }

Du hast zwei Angaben, das geht nicht.Teste mal und kommentiere die zweite Angabe so aus:

/* #headerimg {
margin: 0;
height: 200px;
width: 100%;
} */

Dein Headerbild sollte nicht breiter als 740 px sein, siehe erste Angabe.
Auch würde ich diese Angabe:
#header {
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;

}

hier rein packen:
#headerimg {
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;margin: 7px 9px 0;

height: 192px;

width: 740px; }

vs-intruder

au-shit!
Jetzt hab ich wohl was verkehrt gemacht. Sieht noch schlimmer aus.

ok- hab´s gerade gesehen, hatte bei Auskommentieren den Abschlußtag vergessen.

Die 2. Änderung habe ich nun gemacht:
#headerimg {
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;margin: 7px 9px 0;
height: 192px;
width: 740px; }

Muß denn dann die Angabe, wo sie vorher gestanden hau auch auskommentiert werden?

Die Grafik steht aber immer noch über. Die Änderungen mußten doch in style.css gemacht werden-oder?

Puhhhhh- ich kriegs einfach nicht hin!

SuMu

ganz ruhig bleiben,
immer alles vorher sichern!

dein bild sollte auch die Maße haben, die du in der css-Datei unter #headerimg angibst.

das hier, kannst du auch auskommentieren:

Code

#header {
/*background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;*/


    }

vs-intruder

ok- zumindest habe ich mit Deiner Hilfe schon mal die richtige Größe der Grafik hinbekommen.
Wenn ich das zuletzt von Dir genannte im style.css auskommentiere, bleibt nur noch der blaue Hintergrund von der originalen Grafik übrig; also habe ich dies wieder rückgängig gemacht.

Jetzt müßte ich nur noch wissen, wie ich diesen blauen Hintergrund, auskommentiere.

Gruß
Frank

SuMu

du hast in deiner css verschiedene Angaben, fast doppelt, such mal danach:

Code

#header {
    background-color: #73a0c5;
    margin: 0 0 0 1px; 
    padding: 0; 
    height: 200px; 
    width: 758px;
    }

Code

#headerimg {
    margin: 0;
    height: 200px;
    width: 100%;
    }

Code

#header {
     background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center; 
    }


#headerimg     { 
    margin: 7px 9px 0; 
    height: 192px; 
    width: 740px; 
    }

so geht das nicht, da kann nur Murks heraus kommen :-/

SuMu

erst bitte alles sichern, dann versuche es mal so, aber nur jeweils einmal #header und #headerimg !!!!!

Code

#header {
    margin: 0 0 0 1px; 
    padding: 0; 
    height: 200px; 
    width: 758px;
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center; 
    }

Die Farbe #73a0c5 kannst du ja ggf. noch verändern

Code

#headerimg     { 
    margin: 7px 9px 0; 
    height: 192px; 
    width: 740px; 


    }

ich würde es allerdings so machen, das bild in #headerimg:

Code

#headerimg     { 
    margin: 7px 9px 0; 
    height: 192px; 
    width: 740px; 
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;
    }

Code

#header {
    margin: 0 0 0 1px; 
    padding: 0; 
    height: 200px; 
    width: 758px;


    }

vs-intruder

puhhh- denke mal, ich nähere mich.
Habe alles durchsucht und die doppelten und auch die headersachen rausgenommen und mit, den o.g.ersetzt.
Jetzt sieht´s vom Layout her ganz gut aus, aber die Headergrafik fehlt. *schwitz

So, hab´s erst mal hinbekommen, dank Deiner Hilfe ;-)

SuMu

sieht doch gut aus:mrgreen:

ds2008

Dasselbe Problem

Hi Leute,

mein Blog: Granthin?m 2

Code

#header {
    background: #73a0c5 url('images/myheader.jpg') no-repeat bottom center;
    }


#headerimg {
    margin: 7px 9px 0;
    height: 488px;
    width: 650px;
    }

2. #header und 2. #headerimg auskommentiert.

Problem: Das Bild wird größer dargestellt als eigentlich (650x488, siehe "View background image" im Browser), warum? Wie kriege ich das überlappende untere Farbfeld weg?

Gruss,
DS

gsibergerin

Das Bild wird größer dargestellt? Versteh ich nicht... Du meinst den blauen Hintergrund?

Code

#header {style.css (Linie 38)
background:[COLOR=Red]#73A0C5[/COLOR] url(images/myheader.jpg) no-repeat scroll center bottom;
}

Lösche den rot markierten Teil, dann ist das Blau im Hintergrund weg. Ist es das, was du meinst?

ds2008

Nein die Farbe ist o.k., der Hintergrund lappt aber einige Pixel über den Rahmen hinaus, wie kann man das ändern?

Das Bild wird anders als Original dargestellt (siehe im Browser z.B. Firefox Rechtklick -> View Background Image), siehe die groben Pixel im Gesicht. Ich glaube allerdings mittlerweile das das Bild ein wenig gestaucht ist. Wie kann man das ändern?

Gruss,
DS

ds2008

Hat sich erledigt.

Gruss,
DS

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Headergrafik passt nicht

Jetzt mitmachen!