MyBB Community Forums

I've searched all day for a tutorial for round corners but not no answer. Can anyone help me?

Thanks

thanks matt, but one question, were i put the div? and the

    * -moz-border-radius-topleft  / -webkit-border-top-left-radius
    * -moz-border-radius-topright / -webkit-border-top-right-radius
    * -moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
    * -moz-border-radius-bottomright / -webkit-border-bottom-right-radius

ACP>Themes & Styles>Themes>**your theme**>global.css (simple edit mode)
And choose want you want to round on the corners (like tborder, thead or tcat) from the dropdown.

Then paste the code on the extra CSS. (either that, or simply do it on the advanced mode if you can handle it)

You just put those into a CSS class. For example, I use this...

.form {
background:#FFFFFF;
font-family: "Trebuchet MS";
font-weight: bold;
border: 1px solid #000000;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

... to have rounded corners for input boxes and dropwodn menus on forms. Put it in a CSS class and then use <div class="whatever">Test</div> and it'll have rounded corners.

perfect, you are one in a milion :X thanks a lot

u2 faviouz :*

All rounded:
background-color: #ccc;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #000;
padding: 10px;

If you don't want to round every corner, like just the top ones or the bottom ones, use these instead. You just have to change the radius lines up there (in the all rounded thing) for these.

-moz-border-radius-topleft / -webkit-border-top-left-radius
-moz-border-radius-topright / -webkit-border-top-right-radius
-moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
-moz-border-radius-bottomright / -webkit-border-bottom-right-radius

I have alternative and best way example by using CSS.
I've got this from Google
Try to see this link (as example) or this also
And then play it with this CSS code on your themes (global).
And I guarantee, this round corner will work on all browser including Opera and IE. Not only "bad" Mozilla base browser from displaying this CSS http://www.css3.info/preview/rounded-border/

enjoy this code

#rnd_container {
background: #fffbf3; margin:1px;
}

.rnd_top, .rnd_bottom {
display:block; background:#fffbf3; font-size:1px;
}

.rnd_b1, .rnd_b2, .rnd_b3, .rnd_b4 {
display:block; overflow:hidden;
}

.rnd_b1, .rnd_b2, .rnd_b3 {
height:1px;
}

.rnd_b2, .rnd_b3, .rnd_b4 {
background:#FFFBD9; border-left:1px solid #cbcbcb; border-right:1px solid #cbcbcb;
}

.rnd_b1 {
margin:0 5px; background:#cbcbcb;
}

.rnd_b2 {
margin:0 3px; border-width:0 2px;
}

.rnd_b3 {
margin:0 2px;
}

.rnd_b4 {
height:2px; margin:0 1px;
}

.rnd_content {
    display:block;
    border:0 solid #cbcbcb;
    border-width:0 1px;
    padding: 5px;
    background:#FFFBD9;
    color:#000000;
}

and I just found the site related here

http://www.curvycorners.net/