Wie codiert man diesen Ribbon-Effekt?

**JohnReinert** · 06.02.2012, 02:25

http://www.from-the-couch.com/post.c...se-css-sprites

Eckige Ribbon sind nicht sehr schwer,auch die oberen Rundungen sind nicht schwer doch wie codiert man den Unteren Teil?

**webmichl** · 06.02.2012, 07:14

Das sind Grafiken: http://www.from-the-couch.com/images...t/tv_guide.png

**JohnReinert** · 06.02.2012, 08:53

Mhm, das habe ich gesehen doch vielleicht hat ja jemand eine Idee?

Also einzelne Ecken abrunden ist einfach,ich habe irgendwo malwas von negativen margin gelesen... Vielleicht wäre das ein Lösungsansatz für den unteren Bereich...

**webmichl** · 06.02.2012, 09:23

Du könntest mehrere DIVs verschachteln:

Code:

<style type="text/css">
<!-- 
.main {
position: relative;
background-color: red; 
width: 200px; height: 40px;
line-height: 20px;text-align: center;
border-radius:15px;
-moz-border-radius: 15px;
} 
.sub1 { width: 200px; height: 20px;
border-radius:15px;
-moz-border-radius: 15px;
position: absolute;left: 0px; bottom: 0px;
background-color: #880000;
}
.sub2 { width: 170px; height: 400px;
position: absolute; left: 15px; top:2px;
background-color: black;
}
-->
</style>
</head>
<body>
<div class='main'>
<div class='sub1'>
<div class='sub2'>
&nbsp;
</div>
</div>
</div>

ob das aber so praktikabel ist... keine Ahnung...

**JohnReinert** · 06.02.2012, 12:35

Danke, ist echt nicht praktisch... doch in der Theorie würde es funktionieren, vielleicht setze ich das mal konsequenter um :-)

zur Startseite vom TP

Thema: Wie codiert man diesen Ribbon-Effekt?

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

Wie codiert man diesen Ribbon-Effekt?

Aktive Benutzer

Aktive Benutzer

Ähnliche Themen

[FW MX 2004] Effekt wie diesen

wie diesen effekt erzielen?

Diesen Effekt erstellen

Wie bekomme ich diesen Effekt?

Wie bekommt man diesen Effekt hin??

Aktive Benutzer

Aktive Benutzer

Berechtigungen