[Hilfe] Wordpress Menü CSS abgeschnittene Ecken

[G4M3Rs L1F3]

Da nach mehreren Anfragen den Thread keiner hier her verschieben möchte veruschs ich eben so

[yym3]

Für Mozilla...
-moz-border-radius
-moz-border-radius-topleft
-moz-border-radius-topright
-moz-border-radius-bottomleft
-moz-border-radius-bottomright

Für Safari...
-khtml-border-radius
-khtml-border-radius-topleft
-khtml-border-radius-topright
-khtml-border-radius-bottomleft
-khtml-border-radius-bottomright

mit denne kannst du die ecken sozusagen abrunden, aber nicht direkt "abschneiden". Evtl tut das ja auch seinen Zweck für dich. Ansonsten fällt mir keine andere Lösung außer mit einem Bild zu realisieren ein.


Gruß
yym3.

[G4M3Rs L1F3]

Originally Posted by yym3

Für Mozilla...
-moz-border-radius
-moz-border-radius-topleft
-moz-border-radius-topright
-moz-border-radius-bottomleft
-moz-border-radius-bottomright

Für Safari...
-khtml-border-radius
-khtml-border-radius-topleft
-khtml-border-radius-topright
-khtml-border-radius-bottomleft
-khtml-border-radius-bottomright

mit denne kannst du die ecken sozusagen abrunden, aber nicht direkt "abschneiden". Evtl tut das ja auch seinen Zweck für dich. Ansonsten fällt mir keine andere Lösung außer mit einem Bild zu realisieren ein.


Gruß
yym3.

wie du auf den Bildern siehst ist links oben eine abgerundete Ecke
daran können wir erkennen das wusste ich schon.

ich suche aber ausdrücklich abgeschnittene Ecken wie ich es auf dem Bild verdeutlicht habe

trotzdem mal Danke

[Fratyr]

Originally Posted by yym3

Für Mozilla...
-moz-border-radius
-moz-border-radius-topleft
-moz-border-radius-topright
-moz-border-radius-bottomleft
-moz-border-radius-bottomright

Für Safari...
-khtml-border-radius
-khtml-border-radius-topleft
-khtml-border-radius-topright
-khtml-border-radius-bottomleft
-khtml-border-radius-bottomright

mit denne kannst du die ecken sozusagen abrunden, aber nicht direkt "abschneiden". Evtl tut das ja auch seinen Zweck für dich. Ansonsten fällt mir keine andere Lösung außer mit einem Bild zu realisieren ein.


Gruß
yym3.

Safari verwendet WebKit, das heißt das du das -webkit Prefix verwenden musst, und
nicht(mehr) -khtml. Ansonsten kann man als letzte Lösugn immernoch css3Pie verwenden.

[G4M3Rs L1F3]

HALLO ?!

ich will keine runden Ecken ?!
Runde Ecken hab ich doch schon lange

könntet ihr bitte auf die abgeschnittenen Ecken eingehen ?!

[NotEnoughForYou]

Wie ich im 1. Thread schon gesagt habe , glaube ich nicht dass es mit reinem css realisierbar ist. Was spricht fuer dich gegen eine Lösung mit Bildern ?

[Fratyr]

Originally Posted by G4M3Rs L1F3

HALLO ?!

ich will keine runden Ecken ?!
Runde Ecken hab ich doch schon lange

könntet ihr bitte auf die abgeschnittenen Ecken eingehen ?!

Ernsthaft, du erwartest Hilfe von Leuten die du gerade dumm anmachst nur weil sie
deine Frage wohlmöglich falsch verstanden haben? Du hast wohl keine Erziehung
genossen

Abgeschnittene Ecken sind mit CSS nicht möglich, können aber mit Canvas
realisiert werden. Die beste Möglichkeit wäre wie mein Vorposter bereits erwähnte
mit Bildern.

[G4M3Rs L1F3]

Wenn ich dich dumm anmache sieht das anderst aus ;-)

Ich habe schon mehrere Tutorials mit abgeschnittenen Ecken via CSS gesehen also geht es ja anscheinend doch
(jedoch hat keines mit dem php Code harmoniert bzw ich konnte es nicht richtig anwenden)

[yym3]

dann haben die im PHP code auch nur ein Bild erstellt und mehr nicht, andere Lösung ist mir nicht bekannt.

Gruß
yym3.

[G4M3Rs L1F3]

Beispiel #1:

Ecken ab (und hinzu)

Ich hätte da noch weitergehende Ideen, wie negative Radien, die wirken, als hätte man eine Ecke abgebissen (a).
Vor nicht allzulanger Zeit waren schräg abgeschnittene Ecken auch beliebt (b).
Und negative Ecken erzeugten so etwas wie Eselsohren (c).
Ups, das ist ja alles schon möglich, dank CSS3 Tranform.
a) b) c) d)

Dann wird auf folgende Seite verwiesen:

Mit der Seite kann ich jedoch nichts anfangen, bzw wüsste nicht wie ich damit die Ecke abschneiden kann

Eine Weitere Möglichkeit Ecken "abzuschneiden":


Hilft mir in meinem Fall auch nicht da die Ecke dann "falschrum" abgeschnitten wurde.
(was ich damit meine: Wende ich das auf meine Navigation an ist die Rechte Obere Ecke von Links Unten nach Rechts Oben abgeschnitten, nicht wie von mir gewollt von Links Oben nach Rechts Unten)

Beispiel #3:


Hat bei mir aber auch nicht funktioniert

Hoffe jetzt kommt kein Post mehr der mir versichern will mit CSS könne man keine Ecken abschneiden.

[FichteFoll]

1) Kann ich nichts mit anfangen, also eigentlich genauso wenig wie du. Was CSS-Transforms sind ist eigentlich klar, aber wie man damit Dinge "abschneiden" soll, kann ich mir nicht denken.

2) Viel zu umständlich. Schmutziger Hack, um sich irgendwelche Formen zu basteln. Da würde ich lieber zu Bildern greifen.

3) Gradients sind eine gute Idee. Eine ziemlich gute. Man kann sie beliebig anpassen (wenn man sie versteht) und das mit den Ecken ist schon kein Problem mehr. Allerdings wird das Element als solches (das <div>) nicht abgeschnitten sondern nur der Hintergrund. box-shadow wird da zum Beispiel irgendeinen Bockmist fabrizieren, der zwar quadratisch ist aber bei solch einem Hintergrund nicht schön aussieht.

Ich verstehe allerdings nicht, warum du es nicht mit Bildern machen willst. Sicher, CSS ist toll und macht Spaß, weil es so dynamisch ist, aber auch CSS hat Grenzen. Und CSS3 wird auch noch nicht von allen Browsern vollständig unterstützt, weil es für gerade einmal 2 oder 3 Sektionen davon Standards gibt.


Übrigens würde ich es als Alternative mit einem zweiten Element (div) probieren, was die Ecke der Navibar überlagert. Das kannst du dann ein bisschen stylen und es sollte so aussehen wie auf den Bildern von 1). Schön ist das trotzdem nicht.

[G4M3Rs L1F3]

Ja wollte das eben mit CSS machen weil ich das grad am "erforschen" bin ^^ aber dann hab ich da wohl schon eine Grenze gefunden ^^

Habs schon mit Bildern gemacht
Danke an alle die sich den Kopf zermattert haben =)

Das Ergebniss könnt ihr in 1 1/2 Monaten dann bestaunen ^^