CSS Ribbon über komplette DIV Länge

[xuLLix]

Hallo,

ich habe mir folgende CSSRibbon Navigation zusammen gebastelt..



Eigentlich wollte ich diese Navigation komplett über die Weiße-Graue Fläche (wrapper_inside) haben, allerdings bekomme ich das nicht angepasst... ich weiß ernsthaft nicht mehr wo ich die Pixelschubserrei ansetzen soll... Bin wohl Betriebsblind.

Ich werde das ganze nochmal gesondert erneut aufbauen und anders überlegen aber vielleicht wisst ihr noch was ich tun kann

Grüße

 

[cebito]

AW: CSS Ribbon über komplette DIV Länge

Gib mal den richtigen Link, man landet auf der 404-Seite.

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

Ich bin nicht nur doof... sondern trottelig



...

 

[cebito]

AW: CSS Ribbon über komplette DIV Länge

Bau bitte erstmal deine Navi richtig auf, die gehört in eine Liste und das strong hat da nix verloren. Dann hast du auch genug Elemente um es so zu stylen wie du es willst.

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

Dachte ich mir, dass ich das neumachen muss

Ich überlege mir gerade wie ich das anstelle... danke Trotzdem

 

[Myhar]

AW: CSS Ribbon über komplette DIV Länge

Ganz einfach, Navigationen werden immer nach dem selben Prinzip erstellt. Nachdem es eine Aufzählung von Links ist gehört sie, wie cebito schon richtig sagte, in eine Liste:

<ul>
<li><a href="www.google.at">Dumdidum</a></li>
<li><a href="www.google.at">BliBlaBlubb</a></li>
</ul>

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

Jo.. das ist mir klar... ich meinte das drumherum

Aber das sollte nicht das Problem sein, ich tue mir im Moment nur mit der Programmiererei schwer

Ich denke ich versuche einfach dem DIV "Header" das Ribbonaussehen zu verpassen und die LI Elemente bekommen diesen Hovereffekt... sollte ich irgendwie schon hinbekommen

 

[Gelöschtes Mitglied 133165]

AW: CSS Ribbon über komplette DIV Länge

wrapper_inside hat eine Gesamtbreitbreite von 80% + Innenabstand von 20 px nach allen Seiten (+1 Zeile nach oben)Da ist also ne Menge "Luft" drin.

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

Hello again,

ich habe mich jetzt noch einmal dran gesetzt und es funktioniert soweit auch... ich habe nur ein paar Probleme mit den Feinheiten...

Ich will es ja nun 3d Artig haben... bedeutet der Ribbon soll über den Rand gehen und dann nach hinten abklappen, das steht ja schon, wieder umklappen und noch ein stück laufen... das steht auch schon...

Aber ich kann die einzelnen teile nicht überlappen lassen... die z-index Werte nicht an

Es ist bestimmt nen Anfängerfehler... aber ich habe heute schon den ganzen Tag probiert und getüdelt

Ich brauch sicher nur nen Denkanstoß.. danke schon einmal für die Hilfe und vielen antworten.

 

[cebito]

AW: CSS Ribbon über komplette DIV Länge

Aber ich kann die einzelnen teile nicht überlappen lassen... die z-index Werte nicht an

Ich versteh nur Bahnhof zumal der "Satz" sehr abrupt endet, visualisiere bitte, was dir vorschwebt.

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

Guten Morgen,

erstmal Danke für deine Hilfe Cebito, bist in meinen Augen einer der CSSPäpste hier .
Also ich habe hier mal nen Bild von meinem Wunschergebnis hochgeladen:




Ich will dazu sagen, dass meine CSS Kenntnisse rudimentär sind, aber mit dieser Internetseite verbessert werden sollen. Das ist jedenfalls das Ziel, sonst würde ich alles mit Bildern in Zusammenarbeit mit PS machen. Deshalb will ich auch nicht unbedingt den fertigen Code haben, außer mit einer kurzen Ansage was der tut. Ich kann das zwar schon einigermaßen lesen, es muss aber nicht sein.
Ein Verweis mit nem kleinen Hinweis wäre echt cool...

Des Weiteren muss ich hinzufügen, dass w3schools und google mittlerweile sowas wie gute Freunde geworden sind und ich den Traffic der Seiten wahrscheinlich ins unermessliche getrieben habe
Ich weiß auch schon, wie Ribbons funktionieren und finde, was diese pseudo-classes und pseudo-elements können echt cool.

Ich bedanke mich für weitere Hilfe.

 

[Davi2000]

AW: CSS Ribbon über komplette DIV Länge

Vielleicht hilft dir ja das hier weiter.

http://css-tricks.com/snippets/css/ribbon/

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

den hab ich schon gesehen...

Ich hab jetzt auf die Flügel verzichtet und bin auf einem weiteren Stand
Wer mal gucken will



Die farbliche Abstimmung und Feinheiten, sowie Typographie sind noch nicht bearbeitet worden

PS: könnt ihr mir ein Foto von dem Layout unter eurer Auflösung machen? Meine Möglichkeiten sind beschränkt

 

[simonpicos]

AW: CSS Ribbon über komplette DIV Länge

Hey, ich hab hier nen netten Link für dich:
Du musst ja nicht den Code kopieren, könntest aber schauen, wie es da gemacht wird

bzgl Screenshot: Könnte bieten in 1920*1080, 1366*768 und 320*240 (smartphone).. brauchst du?

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

1920*1080, 1366*768

Die beiden würde ich gerne mal sehen...

Kann ich eigentlich bei

#example{position:absolute;right:20%;}

anwenden...

Danke für die Screenies... würde mir auch in der Gesamtheit reichen... ich selber kann 1024*768 und 1280*1024 abdecken

 

[simonpicos]

AW: CSS Ribbon über komplette DIV Länge

Schiddeböhn:

http://i.imgur.com/BKlAM.jpg

http://i.imgur.com/ELwiA.jpg

 

[xuLLix]

AW: CSS Ribbon über komplette DIV Länge

hmm obwohl ich es mit Prozenten angegeben habe, zeigt er bei der großen geschichte noch probleme... .naja

Sonst sieht es ok aus...