Mehrere Bilder im Header

[giaccomo]

Hallo zusammen,

ich nutze CMSMS seit Ende letzen Jahres und bin schwer begeistert
Bisher haben meine HTML-Kenntnisse ausgereicht, um die gewuenschten Resultate zu erzielen.

Nun habe ich eine aehnliche Herausforderunge wie in diesem Post Mehrere Bilder im Header verlinken.
-> Ich moechte im Header Bereich mehrere Bilder einfuegen.

Als Loesung war von cyberman vorgeschlagen:

Wenn Du die Bilder in einen eigenen -Container verpackst und mit einer ID versiehst, solltest du sie wie gewünscht positionieren können.

Da ich CSS nur durch 'try & error' kenne, komme ich nun mit der Aufteilung durcheinander.

Ich finde im Template

und im entsprechenden Layout

  /* HEADER */
        div#header {
            margin: 0;
            padding: 0;
            height: 80px;
            background: #7C4936;         
            text-align: left;
        }
        div#header h1 a {
            background:  url(uploads/images/banner1.gif) no-repeat 0;
            display: block;
            height: 80px;
            text-indent: -700em;
            width: 298px;
            margin: 0;
            padding: 0;

Im Template hatte ich erwartet, 

header h1 a

zu finden, um nach diesem Schema weitere Container anzulegen.
Also habe ich bisher nur ein Bild eingebunden und bin gespannt, was Ihr fuer Vorschlaege fuer mich habt

Danke fuer Eure Hilfe, Giaccomo

[Piratos]

Nun jetzt keine Hilfe zum konkreten Fall - aber allgemein.

Man kann nicht alles wissen, aber es ist für mich schon wichtiger zu wissen, wo man nachschlagen kann.

http://selfhtml.org/ ist eine solche Quelle - die man sich auch downloaden kann.

Ich schau da selbst häufig genug rein - sehr zu empfehlen, denn eigentlich findet man da immer etwas zu allgemeinen HTML, CSS und auch PHP - Themen.

[hauki]

Im Template hatte ich erwartet, header h1 a zu finden...

findest du ja auch
das bedeutet das alle links die sich in einer h1 überschrift befinden, die sich wiederum innerhalb des divs mit der id header befindet, die im stylesheet genannten eigenschaften haben,inklusive dem selben hintergrundbild.

wenn du nun links einfügen möchtest mit verschiedenen hintergrundbildern, musst du für jeden einzelnen link eine id vergeben und im stylesheet mit dem gewünschten hintergrundbild und weiteren eigenschaften ausstatten.

[giaccomo]

@ Piratos
Danke fuer den schnellen Hinweis. Ich bin von Deinen Aktivitaeten hier echt beeindruckt!

@ hauki
Ahhh. Das erklaert es, Danke schoen!
Laienhaft macht das allerdings auf mich den Eindruck, als wuerde das Ueberschriftenelement in diesm Fall 'Missbraucht'. Wo liegt der Vorteil?
Auf dieser Basis finde ich auf den ersten Blick keinen Weg, weitere Bilder nach Wunsch zu platzieren. Sprich: wie ordne ich weitere Bilder nebeneinander an, bzw. richte ein weiteres Bild rechts aus? 

Als Loesung habe ich fuer mich dann einen globalen Inhaltsblock erstellt, wo ich (da ich nicht ganz so 'Codefest' bin) ueber eine Tabelle wiederum sehen kann, wie ich was platziere.

Wenn Ihr einen Hinweis habt, wie man einzelne ids nach Wunsch platzieren kann, bzw. eine Quelle zum Thema habt, freue ich mich natuerlich auch

Klasse Forum, tolles Programm!

[hauki]

Wenn Ihr einen Hinweis habt, wie man einzelne ids nach Wunsch platzieren kann..

eine möglichkeit ist die links pixelgenau absolut zu positionieren.

du fügst im template folgendes ein:




usw.....

im stylesheet dann folgendes:

#link1 {
display:block;
position:absolute;
left:40px;
top:40px;
height:80px;
width:100px;
background:url(pfad zum hintergrundbild);
}

#link2 {
display:block;
position:absolute;
left:150px;
top:40px;
height:80px;
width:100px;
background:url(pfad zum hintergrundbild);
}

usw...

die werte kannst du nach deinen bedürfnissen mit "try & error" anpassen


ps.: es lohnt sich auf jeden fall sich mal mit css zu befassen,ist auch nicht sonderlich schwierig.befolge am besten mal piratos tip.

[giaccomo]

Herzlichen Dank - genau die Infos, die ich brauchte!

Darauf aufbauend ist es einfach leichter, sich weiteres Wissen anzueignen

Ich habe hier fuer mich viel brauchbares zum Thema CSS gefunden: http://www.css4you.de