Garis Lengkung pada Border Blog CSS

Pada defaultnya, setiap border (garis tepi) dengan syntax nya (border:...px) akan otomatis berbetuk persegi. Hal ini mungkin dari sebagia blogger akan memandang seperti sangat kaku. Misalnya, border background postingan, border background menu, dll.
Dan untuk mengubah supaya tidak persegi alias lengkung (berradius)/ border-radius, maka ada beberapa kode yang harus ditambahkan. Anda perlu tahu, bahwa setiap Browser, memiliki perbedaan dalam membaca sebuah kode CSS or HTML. Oleh karena itu saya perjelas pada beberapa Browser pengaplikasiannya.

Mozilla Equivalent	Browser Opera 10.5	Webkit Equivalent (Safari 3)
-moz-border-radius-topright	border-top-right-radius	-webkit-border-top-right-radius
-moz-border-radius-bottomright	border-bottom-right-radius	-webkit-border-bottom-right-radius
-moz-border-radius-bottomleft	border-bottom-left-radius	-webkit-border-bottom-left-radius
-moz-border-radius-topleft	border-top-left-radius	-webkit-border-top-left-radius
-moz-border-radius	border-radius	-webkit-border-radius

Di bawah ada beberapa contoh yang mungkin bisa memperjelas dalam pengaplikasiannya.
1. Untuk Mozilla

<div style="background-color:#ccc; -moz-border-radius:5px; border:1px solid #000; padding:10px;">ISI TULISAN</div>

<div style="background-color:#ccc; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border:1px solid #000; padding:10px;">ISI TULISAN</div>

<div style="background-color:#F5F6CE; -moz-border-radius-topright:30px; -moz-border-radius-bottomright:30px; border:5px solid #000; padding:10px;">ISI TULISAN</div>

<div style="background-color:#F5F6CE; -moz-border-radius-topleft:30px; -moz-border-radius-bottomright:30px; border:5px solid #38610B; padding:10px;">ISI TULISAN</div>

<div style="background-color:#F5F6CE; -moz-border-radius:30px 10px; border:5px solid #38610B; padding:10px;">ISI TULISAN</div>

2. Untuk Safari

<div style="background-color:#A9D0F5; -webkit-border-top-left-radius:30px; -webkit-border-bottom-right-radius:30px; border:5px solid #38610B; padding:10px;">ISI TULISAN</div>

<div style="background-color:#F5D0A9; -webkit-border-top-left-radius:50px; -webkit-border-top-right-radius:50px; border:5px solid #38610B; padding:10px;">ISI TULISAN</div>

3. Untuk Opera

<div style="background-color:#F5F6CE; border-radius:30px; border:5px solid #38610B; padding:10px;">ISI TULISAN</div>

4. Untuk selanjutnya silakan Anda pelajari dengan giat.

---Sucses for Us---