✔ Bild wiederholen + Abschluss bei Menü... wie?

K

Khyrsanth

Mitglied
Hallo,

ich (ziemlicher CSS-Newbie, außer Linkfarben und Scrollbalken hab ich bisher nicht viel damit gemacht) möchte gerne in mein Layout unter dem seitlichen Menü eine Grafik (leicht marmorierte Säule) einbauen.

Ist es irgendwie per CSS möglich dass diese Grafik nach unten hin so oft wiederholt wird bis das Menü zu Ende ist und dann eine kleine Abschlußgrafik angezeigt wird?

Oder geht so etwas nur mit einer einzelnen (großen) Grafik?

Ich habe zwar rausgeknobelt durch rumprobieren dass ich die Grafik ewig wiederholen kann aber weiss nicht wie ich da das Endstück am Ende anpappen kann bzw. woher das CSS dann "weiß" dass die Endgrafik dran soll :confused:

Code: 
.saeule {
width:91px;
background-image:url(grafikgebastel/saeule-mitte.gif);
background-repeat:repeat-y;
vertical-align:top;
}

Oder kann/muß man das irgendwie mit Tabellen regeln?
 
Hi,

vielleicht ist dir hier mit der Positionierung des Hintergrundbildes geholfen:
CSS: 
.saeule {
width:91px;
background-image:url(grafikgebastel/saeule-mitte.gif);
background-repeat:repeat-y;
background-position:left bottom;
vertical-align:top;
}

Ansonsten solltest du mal einen Link zu deiner Seite posten, falls ich dein Anliegen mißverstanden habe, denn aus dem CSS-Schnipsel ist der detailierte Aufbau der Seite nicht ersichtlich.

mfg Maik
 
Hmm damit wird aber quasi nur das Mittelstück eben positioniert oder? Jedenfalls sieht es so aus bei mir.

Hab die Dateien mal angehängt (Online ist leider noch nichts, das ist noch so ein Grundgerüst dass ich momentan noch offline rumbastel, wenn es dann einfacher zu entschlüsseln ist wenn es online ist versuche ich mal das Grundgerüst bis morgen hochzuladen und melde mich nochmal hier).

Also das Mittelteil soll so lange wiederholt werden bis das Menü zu Ende ist und dann soll das Endstück unten dran sein.

Zur Not (das Layout der Seite ist eh mit Tabellen denn DIVs sind für mich noch mehr böhmische Dörfer als CSS *g*) mach ich einfach noch eine Tabelle in die Tabellenspalte mit 2 Zeilen und bei der unteren dann das Endstück dran (in der Hoffnung es hängt dann dort wo ich es haben will ;) )
 

Anhänge

  • saeule-mitte.gif
    saeule-mitte.gif
    11,5 KB · Aufrufe: 157
  • saeule-ende.gif
    saeule-ende.gif
    3,6 KB · Aufrufe: 152
Sooo ich brauche mal bitte Hilfe bei meiner Großbaustelle ;)
Grafiken usw. ändern sich teilweise noch, sind einfach damit man ne grobe Vorstellung hat.

1.
Warum sehe ich bei Dreamweaver und im Offline-Modus ohne Probleme die Säulenmitte (saeule-mitte.gif) aber online nicht? *verzweifel*

2.
Dieser Strich unter dem kastenheader... wie bekomme ich da eine andere Farbe hin? Irgendwie bin ich zu blind die Zeile zu finden um die zu ändern.

3. Seitenmenü
- Die weiße Umrandung ist nur beim Mouseover überall, ansonsten fehlt sie rechts... warum?
- Bei Firefox sieht alles prima aus, beim IE wirkt alles zusammengeschoben und überlagert sich. Der Linktext soll erst nach der Grafik anfangen, wie kann ich die Position angeben?

4.
Die 2 Kästen unter dem Seitenmenü
- wie kann ich die Position angeben wo der Text beginnen soll? Schrift soll erst neben der Säule (die man ja momentan dort nicht sieht online) erscheinen. Momentan ist es aber bei FF über die ganze Breite und bei IE alles linksbündig (obwohl beim kastenheader eigentlich rechtsbündig angegeben ist. Der Strich ist beim IE auch nicht über die gesamte Breite)
Oder geht das nur per Tabelle?

5.
Warum ist die Schrift bei den "Weiter"-Links an der Seite weiß und ansonsten wie im Inhalt dunkel? Es sollte dunkel sein, aber auch hier finde ich nicht den Grund warum sie an der Seite weiß bleibt...

Seite
CSS
(nicht wundern wenn ungebrauchtes Zeug im CSS ist, ich hab da so viel mit unterschiedlichen Menüs und Grafiken herumprobiert und glaube ich noch nicht alles entfernt was nicht mehr gebraucht wird)

Achja und noch eine Frage:

Ist es irgendwie möglich die kurzen News an der Seite irgendwo zu hinterlegen und diese per Code auf allen Seiten anzeigen zu lassen ohne dass man sie auf jeder einzelnen Seite ändern muss? Ich weiß bei Systemen mit CMS geht das, aber hier?
 
Zuletzt bearbeitet:
Hi.
  • Sprichst du von "grafikgebastel/saeule-mitte.gif"? Dieses Verzeichnis existiert auf deinem Server nicht.

  • Guckst du hier:
Code: 
h3.kastenheader {
        color:#AF772F;
        font-size: 15px;
        line-height: 25px;
        font-style:italic;
        text-align: right;
        font-family: georgia, verdana, arial, helvetica, sans-serif;
        border-bottom:solid 1px #9ABB6F;
        font-weight: bold;
}
  • Weil dort kein rechter Rahmen definiert ist:
Code: 
#menu1 a, #menu1 a:visited , #menu1 a:active {
        display: block;
        color:#422F16;
        text-decoration:none;
        font-family:verdana, arial, helvetica, sans-serif;
        font-size: 13px;
        padding-left: 0px;
        padding-bottom: 0px;
        padding-top:0px;
        margin-left: 0px;
        margin-right: 0px;
        border-left:solid 1px #fff;
        border-bottom:solid 1px #fff;
        border-top:solid 1px #fff;
        border-right:solid 1px #fff; /* fehlt bei dir */ 
        line-height:27px;
        text-align:center;
        font-weight: bold;
        background-image:url(bilder/antik-kopf6.gif);
    background-repeat:no-repeat;
    background-position:5px 50%;
    padding-left:30px;
}
  • Abstände lassen sich mit der padding- oder margin-Eigenschaft einrichten.

  • Ich seh da nichts weißes bei den "Weiter"-Links.

  • Zusatzfrage: Mit [phpf]include[/phpf] ist es ein Leichtes, zentral abgelegte Inhalte in diverse Projektseiten zu laden.

mfg Maik
 
Maik hat gesagt.:
Hi.

Sprichst du von "grafikgebastel/saeule-mitte.gif"? Dieses Verzeichnis existiert auf deinem Server nicht.

Guckst du hier:
Zum Vergrößern anklicken....
:eek: Danke Maik, da war ich wohl echt betriebsblind, das ist mir überhaupt nicht aufgefallen. Klar, grafikgebastel gibt es online ja garnicht, soll ja auch die Datei im Ordner bilder nehmen, gleich mal geändert :)

Maik hat gesagt.:
Ich seh da nichts weißes bei den "Weiter"-Links.
Zum Vergrößern anklicken....
Also die Schriftfarbe wird beim Menü beim mouseover weiß, im Inhaltsteil ist die Schrift aber dunkel (nicht ganz schwarz aber eben ein anderer Kontrast)

Vielen Dank für die ganzen Tips, irgendwie ist man manchmal wirklich zu blind und findet selbst nichts mehr *Blindenbrille aufsetz* ;-)

Ich werde nächste Woche mal versuchen Deine Tips mit padding und include umzusetzen (IE ärgert mich, bei FF sieht es ja schon einigermaßen ok aus), da muss ich mich erstmal reinwühlen und bin jetzt erstmal ein verlängertes Wochenende unterwegs, es juckt mich schon in den Fingern weiterzubasteln :)
 
Zuletzt bearbeitet:
Khyrsanth hat gesagt.:
Also die Schriftfarbe wird beim Menü beim mouseover weiß, im Inhaltsteil ist die Schrift aber dunkel (nicht ganz schwarz aber eben ein anderer Kontrast)
Zum Vergrößern anklicken....
Schau mal hier:
Code: 
/* allgemeine links im text */
a:link { font-size: 14px; font-family: verdana, arial, helvetica, sans-serif;color:#AF772F}
a:visited {font-size: 14px; font-family: verdana, arial, helvetica, sans-serif;color:#AF772F}
a:active{ font-size: 14px; font-family: verdana, arial, helvetica, sans-serif;color:#AF772F}
a:hover{ text-decoration:none;background-color:#CE9D63;color:#fff;}

...

#sp1 a:hover {background-color:#CE9D63;color:#422F16; text-decoration:none ;
}


mfg Maik
 
AAAH! Danke, da hätte ich wohl noch ewig gesucht, am besten ich mach einfach einmal das mit hover bei der Spalte raus, verwirrt nur und ist ja jetzt eh unwichtig weil ich überall die gleiche Linkansicht haben will :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück