• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bilder als Rahmen

C

cin0s

Neues Mitglied
Hallo Leute,
Ich weiß nicht ob das Titel so richtig passt. Weiß auch nicht ob das mit CSS realisierbar ist oder ob ich da Java Script brauche.

Also:
Ich möchte eine... Ach. Schwer zu erklären. Hier kommt ein Beispiel:
M-A-Styles • Portal

Unzwar diese Umrandung:
umrandung.png


Hat jemand eine Idee?

Danke ;)
cin0s
 
Wenn ich es richtig sehe gibt es im hellen Bereich doch einen Farbverlauf. Den zusammen mit der Rundung kann man heutzutage nur mittels einer Grafik zusammenstellen. Also quasi genau die Grafik die Du hier ausgeschnitten hast als Hintergrundgrafik für die Box eingefügt in der sie erscheinen soll.

Wenn es dir nur um eine einfarbige Rundung geht, kann man das mit border-radius lösen. Aber Vorsicht: die Unterstützung der Browser für diese CSS3-Eigenschaft ist momentan noch recht unterschiedlich, hier muss man browserspezifische Codes verwenden. Der IE unterstützt es bisher gar nicht.
 
Das das nur mit Grafik geht war mir schon fast klar. Das ist auch kein Problem. Nur wie bekomme ich die Grafiken möglichst komfortabel an ihren Bestimmungsort?

Edit: Habe gerade noch ein weiters Problem an einer anderen Baustelle:
Ich will ein Bild als Hintergrund einfügen. Allerdings soll es abgerundete Ecken haben. Das macht eine Javascript der auch so schon funktioniert.

Code: 
<div style=" position:relative; width: 100%; height:100%;  z-index: 1; left: 0px; top: 0px;" id="top_nav_bg"><img class = "corner iradius7" alt="" width="100%"  height="100%" src="images/background.png"  /></div>
<div id="container" style="z-index: 2; position:relative; width: 100%; left: 0px; top: 0px;">
Inhalt
</div>

Geht leider so nicht. Das Bild hat ein föllig falschen Format (es bleibt Qudratisch und wird nicht zum Rechteck). Außerdem weiß ich nicht wie ich "container" genau über das Bild kriegen soll. Das ganze soll möglichst Dynamisch bleiben (in "cointainer" kommt nachher php Code der das Ding füllt).
 
Zuletzt bearbeitet:
Ich habs jetzt mehr oder weniger hinbekommen. Allerdings finde ich gerade einen Fehler nicht. Ich hab mal alles hier nachgeladenen:
Index

Wie ihr sehen könnt fehlen an den beiden Boxen (in Code "top_nav" und "cointainer" unten die Rundengen. Weiß wer wo der Fehler liegt?


Edit: Hab den Fehler gefunden. War ein Rechtschreibfehler ind der style.css -.-
 
Zuletzt bearbeitet:
Die Rundungen hast Du schon genau richtig untergebracht. Hätte ich kaum anders gemacht, auch wenn es noch einige andere Wege gibt sowas zu realisieren :)

Mir fiel allerdings noch auf, dass unter dem o.g. Link 2 Mal ein Doctype vorhanden ist. Vermutlich includest Du per PHP eine komplette HTML-Datei, wodurch der erzeugte HTML-Code nicht mehr valide ist. Schau dir das mal noch an.
 
Danke für den Tipp. Das war wirklich so :D Hab jetzt das Grundgerüst einfach raus genommen...

Ein Probleme habe ich jetzt noch:
Das Drop Down Menü in der Navigation oben bekomme ich einfach nicht in die Mitte :( Hat jemand eine Idee?

Danke :)

Ps: Bitte nicht über den (momentan) unaufgeräumten CSS Code ärgern ;)


Edit: Irgendwie meckert der W3C Validator bei ziemlich vielen div Tags ;/
http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0
 
Alle Errors sind jetzt weg :) Einmal hatte ich in einer Inkludierte php Datei einen </body>. Der hat bestimmt 20 Errors verrucht.
Dann noch unzählige </br>. (Als ich das letzte mal was mit html gemacht hab war es einfach nur <br>. Das ist 5 Jahre oder so her :D Da muss ich mich erstmal umgewöhnen. Wobei ich zugebe das </br> von der Logik her ganzschön hohl ist :oops:)
Und der Like Button hat noch ein paar Errors verursacht...

Wie gesagt. Das is jetzt alles Ok.

Aber das mit dem zentriertem Menü blicke ich nicht so ganz. Irgendwie will das nicht :(
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben