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

Layer-Border nach innen

S

SanCarlo

Neues Mitglied
Hi Leute, ich bin gerade dabei des Design meiner Internetseite zu überarbeiten. Es fehlt nicht mehr viel aber ich habe folgendes Problem:
aC6R6Pw.png


Ich arbeite viel mit Transparenz, jetzt habe ich die Menüleiste links und rechts vom runden Logo platziert und möchte, dass die Border ineinander gehen. Wie man oben im Bild sieht stört der Hintergrund aber im Logo, gibt es einen weg den Rand der Menüleiste so rund auszuschneiden?

GX1Sv78.png
 
border-radius ist ein Radius nach außen wie bei einem Kreis (siehe Kreis um das Logo), gewünscht ist aber ein Radius nach innen, so wie wenn du bei einem Blatt Papier einen Knick nach innen machst (und dann abrundest).

Ziel ist es, die zwei Ecken die in das Logo stehen so wegzuschneiden. Bei deiner Lösung würden sie nur rund...
 
Danke Tronjer, das wäre wirklich eine Möglichkeit auf die ich noch nicht gekommen bin. Wenns eine Möglichkeit mit CSS gibt wäre mir das lieber wegen dem anderen Menüsystem im responsive Design, aber wenn sich nichts finden werde ich darauf zurückkommen :)
 
Rein per CSS ginge es auch. Ein Container in der Mitte, der den Kreis (border-radius: 99) und die Linienansätze enthält. Für die 2 x 3 Linien(-Ansätze) jeweils ein Blockelement mit 2px height und border-top, welches per margin an den Kreis geschoben wird.
 
Doch das Logo hat "leider" auch Transparenz, ist nur zufällig schwarz dahinter :)

Ich arbeite jetzt mal ein wenig weiter und dann kann ich das Design direkt online stellen, dann könnt ihr das direkt anschauen
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben