ref.thorstn.com /
private moziloCMS und CSS Referenzseite

Newsbox mit abgerundeten Ecken (CSS3)


Newsbox mit runden Ecken
Dieser CSS3 Effekt funktioniert standardmäßig leider nicht bei allen Browsern.
Siehe aber die Tricks unter Abgerundete Ecken - vielleicht klappt es ja doch.
Diese Newsbox hat runde Ecken und ist ansonsten schlicht gehalten. Allerdings wird dieser Effekt erst mit der CSS Version 3 (CSS3) verabschiedet und funktioniert nicht bei allen Browsern!

In der .css Datei wird folgendes definiert:

div.newsboxrund {
    vertical-align:top;
    float: right;
    border:1px solid #000000;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background-color: #ffffff;
    width:180px;
    padding:10px;
    margin:0px 0px 5px 10px;
    color:#767676;
    text-align:normal;
   }
  
Als benutzerdefinierte Syntax wird folgendes angelegt:

newsboxrund = <div class="newsboxrund">{VALUE}</div>

Eintrag in die Inhaltsseite:

[newsboxrund|[fett|Newsbox mit runden Ecken]
Dieser CSS3 Effekt funktioniert standardmäßig leider nicht bei allen Browsern.
Siehe aber die Tricks unter [seite=Abgerundete Ecken|css3:abgerundete-ecken] - vielleicht klappt es ja doch.]