Kreis mit CSS3 - CSS3 funktioniert im Internet-Explorer erst ab Version 9 korrekt. Ältere Versionen zeigen hier nur ein Viereck an.

Hier die CSS dieses Kreises, die Ihr “Zwischen Head Tags” der Layout-HTML kopieren könnt.

<style type="text/css">

#kreis { 
    width: 500px; height: 500px; 
    margin: 0px auto 0px auto; 
    border-radius: 250px;
    border: 10px solid #fff; 
    box-shadow: 5px 5px 5px #ccc, -3px -3px #24548B;
    background-image: -moz-linear-gradient(top, #fff, #24548B); 
    background-image: -webkit-linear-gradient(top, #fff, #24548B); 
    background-image: linear-gradient(top,  #fff,  #24548B); 
    background-color: #24548B; 
    } 
    #k_text {    
    font-size: 50px; 
    text-align: center; 
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
    font-weight: bold; 
    margin: auto; 
    line-height: 70px; 
    padding: 110px 20px; 
    text-shadow: 2px 2px #f1f1f1, -1px -1px #fff; 
}

</style>

Dann habe ich ein Textfeld aufgezogen und mich auf diese beiden DIV-Container bezogen.

Also diese DIV-Container in den HTML-Code Editor des Textfeldes kopiert.

<div id="kreis">
   <div id="k_text">
      CSS3 Kreis<br>wird nicht im IE8 oder älter angezeigt
   </div>
</div>