Mini Mods - Simple CSS rounded corners for your forum [no images]

With this simple CSS you can give your forum that look you always wanted. Sick and tired of the old bland square design every where in vBulletin? Well fear no more, because here's your rounded edges.

In your style of choice, go to add the following into the Additional CSS:

.rc{display:block}
.rc *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#000000}
.rc1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #919191;
  border-right:1px solid #919191;
  background:#3f3f3f}
.rc2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #e5e5e5;
  border-right:1px solid #e5e5e5;
  background:#303030}
.rc3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #303030;
  border-right:1px solid #303030;}
.rc4{
  border-left:1px solid #919191;
  border-right:1px solid #919191}
.rc5{
  border-left:1px solid #3f3f3f;
  border-right:1px solid #3f3f3f}
.rcfg{
  background:#000000}

Then in your header, at the very top enter:

<div>
  <b class="rc">
  <b class="rc1"><b></b></b>
  <b class="rc2"><b></b></b>
  <b class="rc3"></b>
  <b class="rc4"></b>
  <b class="rc5"></b></b>

  <div class="rcfg">

Then in footer at the very bottom put:

  </div>

  <b class="rc">
  <b class="rc5"></b>
  <b class="rc4"></b>
  <b class="rc3"></b>
  <b class="rc2"><b></b></b>
  <b class="rc1"><b></b></b></b>
</div>

That will make a black box, with white background, just change the colors in the CSS to match your forum, and you're set!

[Astroholic]

Which file do I add the top coding to?

[elmati]

yeah! im using spiffy corners on my site
it's works in every browser

but, as i see the best way tu make rounded corners is:
http://www.editsite.net/blog/rounded_corners.html

dont worry about js, cause vbulletin require js to work property

[Lizard King]

Why there is no credit to the original creator within the first post ?

[Playa82]

live demo ?

[kj_202]

sounds nice

[Preech]

KJ, I'm no genius, designer or coder. But try playing the css box in your style editor. radius and some number. I'm not to sure. But I'll see if I can make something happen for you. I know most people use images.

[eternal_]

my site has a determined width - not 100% dependent on screen size. How can I add to the css a width of this css centered on the page to follow the rest of the table widths?

[Alexey?]

This is nice.
Tnx

[MaR?]

Not workin on defoult style v3.8.2

[Simon Lloyd]

Originally Posted by MaR?

Not workin on defoult style v3.8.2

Works fine!, i'm using 3.8.3 and it worked when i tried it, i have removed it now as its not for me, maybe you didnt put the code in the correct places.